속성 선택자

설명

CSS Level

CSS 2, CSS 3

[att]

해당 속성이 정의된 모든 요소를 선택합니다. 속성의 값과는 무관합니다.

span[class="example"]
span[hello="Cleveland"][goodbye="Columbus"]

[att=val]

해당 속성이 정의되고 그 값이 해당 값과 동일한 요소들을 선택합니다.

p[color="red"] {...}
p[text-align="center"] {...}

[att~=val]

해당 속성이 정의되고, 공백으로 구분된 값의 목록중 하나가 주어진 값과 동일한 요소들을 선택합니다.

a[rel~="copyright"] { ... }

[att|=val]

해당 속성이 정의되고 그 값이 해당 값과 동일하거나, 또는 주어진 값으로 시작하고 '-' 기호로 이어지는 값인 요소들을 선택합니다.

a[hreflang|="en"] {...}

[att^=val]

해당 속성의 값이 주어진 값으로 시작하는 요소들을 선택합니다. CSS 3.

object[type^="image/"] {...}

[att$=val]

해당 속성의 값이 주어진 값으로 끝나는 요소들을 선택합니다. CSS 3.

a[href$=".html"] {...}

[att*=val]

해당 속성의 값이 주어진 값을 부분 문자열로 가지는 요소들을 선택합니다. CSS 3.

p[title*="hello"] {...}