하위 선택자 : 특정 태그 아래에 있는 태그를 선택한다.
#header h1
자식 선택자 : 바로 아래에 있는 하위 태그만 선택한다.
#header > h1
기본 속성 선택자
- 선택자[속성] : 특정한 속성이 있는 태그를 선택한다.
선택자[속성=값] : 특정한 속성안의 값이 같고, 특정값과 같은 문서 객체를 선택한다.
input[type]
input[type=password]
문자열 속성 선택자
- 태그가 가지고 있는 속성의 특정한 문열을 지정후 선택한다.
- 선택자[속성 ~= 값] : 속성안의 값이 특정 값을 단어로 포함하는 태그를 선택
p[title~=first]
( title p안에 first 문자열을 가지고 있는 태그 )
- 선택자[속성 |= 값] : 속성안의 값이 특정 값과 일치하거나, 지정 속성값 뒤에 하이픈("값-")으로 시작하는 태그를 선택
p[lang|="en"]
(lang 이라는 p 안에 en이라는 속성값을 가진 태그, 영어가 값으로 들어와있는 경우 )
a[href^="https"] : 속성안의 값이 특정 값으로 시작하는 태그를 선택
( 링크 안에 특정한 값""으로 시작하는 태그 )
a[href$="html"] : 선택자[속성 $= 값] : 속성안의 값이 특정 값으로 끝나는 태그를 선택
( 링크 안에 특정한 값""으로 끝나는 태그 )
p[class*="test"]: 선택자[속성 *= 값] : 속성안의 값이 특정 값을 포함하는 태그를 선택
( class p 안에 특정 값을 포함하는 태그)