\'i\' 플래그는 CSS에서 대소문자를 구분하지 않는 속성 일치를 어떻게 활성화합니까?

CSS 속성 선택기에서 "i"의 의미 이해

현대 웹 개발에서 CSS 속성 선택기는 스타일 요소에서 중요한 역할을 합니다. 그들의 속성을 기반으로합니다. 그러한 속성 중 하나가 "i"인데, 이는 그 중요성에 대한 의문을 제기할 수 있습니다.

CSS 선택기 [type="checkbox" i] 해석

당신이 가지고 있는 스니펫 제공된 [type="checkbox" i]는 CSS 선택기 레벨 4에 새로 도입된 기능인 대소문자를 구분하지 않는 속성 일치를 예시합니다. 이 기능을 사용하면 대소문자 차이에 관계없이 속성 일치가 가능합니다.

가용성 및 지원

현재 이 기능은 주요 브라우저 버전에서 광범위하게 지원됩니다.

• 크롬 49
• 파이어폭스 47
• Safari 9
• Opera 37

그러나 버전 39부터 Chrome의 사용자 에이전트 스타일로 사용할 수 있었지만 웹 콘텐츠에서 사용하려면 실험적 기능을 활성화해야 했습니다. .

브라우저 예시 테스트

다양한 브라우저에서 이 기능의 지원을 테스트하려면 다음 HTML/CSS 스니펫을 활용할 수 있습니다.

<br>[data-test] {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">width: 100px;
height: 100px;
margin: 4px;

로그인 후 복사

}

[data-test="A"] {

background: red;

}

[data-test="a" i] {

background: green;

}

지원되는 브라우저에서 div 요소는 녹색으로 표시되어 대소문자를 구분하지 않는 일치가 성공했음을 나타냅니다. 그렇지 않으면 빨간색이 됩니다.

위 내용은 \'i\' 플래그는 CSS에서 대소문자를 구분하지 않는 속성 일치를 어떻게 활성화합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!