속성 선택자,가상요소 선택자

속성 선택자

속성	예시	설명
[name]	a[href]	a태그 속성 중에 href가 있으면 선택
[name="value"]	a[href="#header"]	a태그 href 속성의 값이 '#header'이면 선택
name~="value"	a[href~="web"]	a태그 href 속성의 값이 'web'을 포함한 요소 선택
[name|="value"]	a[href|="web"]	a 태그 href 속성의 값이 'web'이거나 'web'으로 시작하는 요소 선택
[name^="value"]	a[href*="web"]	a 태그 href 속성의 값이 'web'이 포함되어 있는 태그를 선택합니다.
[name$="value"]	a[href$="com"]	a 태그 href 속성의 값이 'com'으로 끝나는 태그를 선택합니다.

가상요소 선택자

속성	예시	설명
::first-line	p::first-line{color: #fff}	첫번째 줄을 선택하여 글씨 색을 하얀색으로 변경
::first-letter	p::first-letter{color:#fff}	첫 글자를 선택하여 글씨 색을 하얀색으로 변경
::before	p::before {content:'시작'}	특정 요소의 내용 (content)부분 바로 앞에 다른 요소를 삽입
::after	p::after{content:'끝'}	특정 요소 내용(content)바로 뒤에 다른 요소를 삽입
::selection	p::selection {color:red}	단락에서 선택한 색깔을 빨간색으로 바꿈