i
와 s
식별자를 사용해서 대소문자 구분 여부를 정의한다.
대소문자를 구분 여부를 지정하는 <attr-modifier> 선택자 타입이 추가적으로 적용된다. 기본적으로 CSS 선택자는 대소문자를 구분한다. i
식별자의 경우 대소문자를 구분하지 않는다
'[' <attr-substring-matching> <attr-modifer>? ']'
아래 유형에서 지원하는 모든 키워드와 단위를 사용하지 않을 수도 있다.
<wq-name> <attr-matcher> [ <string-token> | <ident-token> ]
연산자 | 형식 | 선택자 대상 | 예 |
---|---|---|---|
= | [att=val] | 애트리뷰트(attribute)의 값이 완전히 일치해야 한다. | [type="email"] |
~= | [att~=val] | 애트리뷰트(attribute) 값의 공백으로 구분된 토큰 목록중에 "val" 이 포함되어야 한다. "val"에 공백이 포함되어 있거나 빈 문자열이면 무효가 된다. | [class~="my"] |
|= | [att|=val] | 애트리뷰트(attribute)의 값이 정확히 "val"이거나 "val" 바로 뒤에 "- "(U+002D)으로 시작해야 한다. 애트리뷰트(attribute)의 값에 하이픈이 포함된 경우에 활용도가 높다. | a[hreflang|="en"] |
^= | [att^=val] | 애트리뷰트(attribute)의 값이 "val"을 접두사로 시작해야 한다. "val"이 빈 문자열이면 무효가 된다. | [type^="image/"] |
$= | [att$=val] | 애트리뷰트(attribute)의 값이 "val"을 접미사로 끝나야 한다. "val"이 빈 문자열이면 무효가 된다. | a[href$=".html"] |
*= | [att*=val] | 애트리뷰트(attribute)의 값에 하위 문자열 "val"이 하나 이상 포함되어야 한다. "val"이 빈 문자열이면 무효가 된다. | [title*="hello"] |
[ '~' | '|' | '^' | '$' | '*' ]? '='
<ns-prefix>? <ident-token>
애트리뷰트가 선언되어 있는 대상을 선택자로 사용한다.
[ <ident-token> | '*' ]? '|'
i | s
Modules | ||
---|---|---|
Module Name | Status | Summary |
Selectors Level 4 | Last review date: 2023-2-23 |