>  기사  >  웹 프론트엔드  >  CSS 의사 요소에 대한 단일 또는 이중 콜론: 어떤 표기법을 사용해야 합니까?

CSS 의사 요소에 대한 단일 또는 이중 콜론: 어떤 표기법을 사용해야 합니까?

Susan Sarandon
Susan Sarandon원래의
2024-11-16 19:06:03296검색

Single or Double Colon for CSS Pseudo-elements: Which Notation Should I Use?

의사 요소에 대한 단일 및 이중 콜론 표기법: 실용적인 접근 방식

CSS에서 의사 요소를 타겟팅할 때 단일(:after)과 이중 중 하나를 선택합니다. (::after) 콜론 표기법은 브라우저 호환성으로 인해 논란이 되었습니다. 최신 브라우저는 두 표기법을 모두 지원하지만 이전 버전의 Internet Explorer(IE7 및 IE8)는 이중 콜론 표기법을 지원하지 않습니다.

단일 콜론 표기법과 두 표기법 비교

두 표기법을 모두 사용하여 지원 모든 브라우저가 매력적으로 보이지만 이 접근 방식은 권장되지 않습니다. CSS 2.1 사양에 따르면 사용자 에이전트가 잘못된 선택기(예: 단일 및 이중 콜론 표기법의 조합)를 발견하면 전체 규칙을 무시해야 합니다.

잘못된 선택기의 예:

.foo:after,
.foo::after { /*styles*/ }

최상의 표기법 선택

잠재적인 호환성 문제를 고려하면 단일 콜론 표기법만 사용하는 것이 현재 웹 개발에 더 안정적인 옵션입니다. IE8의 시장 점유율은 여전히 ​​미미하지만 사용자 기반을 고려하고 작지만 여전히 중요한 사용자 그룹의 스타일을 깨뜨릴 수 있는 가능성을 피하는 것이 중요합니다.

향후 이중 콜론 표기법

한 번 IE8의 시장 점유율이 미미해지면 이중 콜론 표기법을 사용하여 보다 구체적인 타겟팅 기능을 활용하는 문제를 다시 검토할 수 있습니다. 그러나 당분간은 단일 콜론 표기법이 가장 실용적인 선택으로 남아 있습니다.

위 내용은 CSS 의사 요소에 대한 단일 또는 이중 콜론: 어떤 표기법을 사용해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.