선택자

CSS를 지정하기 위하여 대상이 되는 노드 (태그) [들]을 선택하는 것을 말한다.

 

<style>

 선택자 {

css내용

}

</style>

 

• 태그이름{} --> 특정 태그에 대하여 CSS를 적용한다.
• .클래스이름{} --> 서로 관련 있는 요소들을 그룹을 지어 줄 때 CLASS 를 사용한다. 특정 클래스에 대하여 CSS를 적용한다.
• #아이디이름{} --> 요소들 중에 유일한 식별자를 지정하기 위하여 ID 를 이용한다. 특정 ID 를 갖는 요소에 대하여 CSS를 적용 한다.
• *{} --> 모든 태그 --> HTML 의 모든 요소를 지칭할 때 *(와일드 카드 문자)를 사용한다. HTML 의 모든 요소에 CSS를 적용한다.
• 태그이름[속성명] -> 그 태그의 특정 속성이 있는 요소
• 태그이름[속성명=값] -> 그 태그이 속성 값을 만족하는 요소들만 선택
• 후손 선택자 : 기준노드 찾을선택자
• 자식 선택자 : 기준노트 > 찾을선택자
• 상태 선택자
  • :hover: 마우스를 올린 대상
  • :active : 마우스를 누르고 있는 대상
  • :focus : input 에 집중된 대상
  • : first-child : 첫번째 자식
  • :last-child: 마지막 자식
  • :nth-child(2n) : 짝수 자식