css - 속성 선택자

html 요소의 속성 유무 또는 속성값을 중괄호[  ] 안에 넣어 선택자로 사용

속성 값	설명
h1[class]	class 명을 가진 h1 요소
img[alt]	alt 속성을 가진 img 요소
p[class="abc"]	class 명이 유일하게 'abc' 인 p 요소
p[class~="abc"]	class 명이 유일하게 'abc' 이거나 여러개의 class 명 중 하나가 'abc'인 p요소
p[class|="abc"]	class 명이 'abc' 이거나 'abc ~ ' 로 시작하는 p요소
p[class^="abc"]	class 명이 'abc' 로 시작하는 p요소
p[class$="abc"]	class 명이 'abc' 로 끝나는 p요소
p[class*="abc"]	class 명이 'abc' 가 포함되어 있는 p요소
a[href^="mailto"]	href 속성값이 'mailto'로 시작하는 a요소

See the Pen css 속성 선택자 by 정은 (@luchiaChoi) on CodePen.

하나씩 지워가며 실습해보세요