CSS를 배워야 하는것

• css는 꾸밈요소가 들어가 있어서 색상이나, 선, 직관적으로 보이는 것들은 따로 공부하는 것이 아니라 쓰는 방법을 체득하는 것이 좋다.
• 위의 내용들을 일일이 공부하면서 체득하는 것이 아닌 따라 써보면서 익히는 것이 좋다.
• 그러나 display: flex, float: left, position: absolute, flex: start 와 같은 속성들은 같이 조합이 되는 경우들이 많기 때문에 해당 내용은 속성을 파악해두는 것이 좋다.
• tag들 중에는 css의 기본값을 가지고 있는 것들이 있다. 속성을 주었을때 눈에 띄는 변화가 없다면 그 태그가 가지고 있는 기본 속성인 경우이다.
• css의 위치나 영역이 보이지 않는 경우에는 background나 border로 표시하여 작업하는 것이 좋다.
• 전체 태그를 지정할 수 있지만 선택자가 길어지고 자세하게 지정할 수록 우선순위가 높아진다
  • a 보다 div a가 우선순위가 더 높다.

선택자

부모-자식
형제, 인접형제
조상-후손

• : 후손선택자
• > : 자식선택자
• + : 인접선택자
• :nth-child() : 같은 위계상에 몆번째인지를 입력하면 그에 해당하는 태그를 고를 수 있다
  • section>div:nth-child(2)
    : 세션 테그 안에 있는 두번째 자식이 div라면
    : 두번째의 위치가 div가 아니라 nav라면 선택되지 않는데
• 태그:nth-of-type(2)
  : 태그들 중에 2번째
• :nth-child(1) = first-child
  : 관련 태그 안에 있는 첫번째 자식
• :nth-last-child(1)=last-child
  : 관련 태그 안에 있는 뒤에서 첫번째인 자식
  선택자가 길면 우선순위가 높다

자동완성

태그.class이름[속성="속성"][속성="속성2"]{태그에 들어갈 내용}
* : 태그 속성을 다쓴 후 *n하면 n만큼 태그가 늘어남
div > nav : div안에 nav를 들어가게 하고 싶다면
+ : 태그 옆에 태그를 잇고 싶다면
ctrl+z : 자동완성 코드로 돌아가고 싶다면