CSS에서 선택자(Selector) : CSS 속성(Property) 1개 또는 그 이상의 속성들을 속성블럭(Property block: {} ) 속에 넣어 놓는 것
일반 선택자의 종류 1. 공용선택자 : * (모든 태그를 지정) 2.타입선택자: A (태그 A를 지정) 3.클래스선택자: .A (클래스가 A 인 태그를 지정) 4.ID선택자 : #A (아이디가 A인 태그를 지정)
복합 선택자 1.하위선택자 : A B (태그 A로 감싸져 있는 태그 B를 지정) 2.자식선택자: A > B (태그 A로 감싸져 있는 태그 B 중 한 단계 밑에 것을 지정) 3.인접선택자: A + B (태그 A와 B가 연속으로 나와 있는 것을 지정)
가상클래스 선택자(Selector) 요소 1. :first-child 선택자 - A:first-child (태그A로 감싸져 있는 가장 처음 태그를 지정) 2.언어선택자 - A:lang(B) (태그A중 언어가 B로 설정된 것을 지정) 3.링크선택자 - A:link (태그A중 링크가 걸려있으면 지정) A:visited (태그A중 링크가 걸렸고 사용자가 이미 클릭한 태그를 지정) 4.동정선택자 - A:active A:hover A:focus
기타 선택자 :Attribute Selector - E[attr] - Element 에 사용된 속성(attribute)와 속성값등이 seletor로 지정하는 조건과 일치할때 적용. ex) *[title]{background-color:gold;} /* titleattribute를 사용하는 문서내의 모든 element(*)에 적용 */
:Attribute Seletor - E[attr="attVal"] - 같은 속성(attribute)의 속성값이 해당 조건과 일치할때 적용 ex) a[href="http://www.ngio.co.kr/"]{font-weight:bold;}
:Attribute Selector - E[attr~="attVal"] - 속성값이 공백으로 분리되어 여러 개일 경우, 값들중에 해당 조건과 일치하는 경우 적용