> 웹 프론트엔드 > CSS 튜토리얼 > Internet Explorer 8에서 nth-child()를 사용하여 테이블에서 Zebra Striping을 어떻게 달성할 수 있습니까?

Internet Explorer 8에서 nth-child()를 사용하여 테이블에서 Zebra Striping을 어떻게 달성할 수 있습니까?

Barbara Streisand
풀어 주다: 2024-11-08 17:37:02
원래의
925명이 탐색했습니다.

How Can I Achieve Zebra Striping in Tables with nth-child() in Internet Explorer 8?

Internet Explorer 8에서 nth-child()에 대한 CSS 지원

최신 브라우저에서 CSS nth-child() 요소는 일반적으로 테이블에서 얼룩말 줄무늬 효과를 얻기 위해 사용되었습니다. 그러나 이 기능은 특히 Internet Explorer 8에는 없습니다. 이 제한 사항을 해결하는 방법은 다음과 같습니다.

Polyfill 접근 방식:

Selectivizr는 Internet Explorer의 폴리필을 효과적으로 확장하는 확립된 폴리필입니다. CSS 지원. Selectivizr를 구현하면 CSS 스타일에서 nth-child()를 활용할 수 있습니다.

Polyfill 없이:

Internet Explorer 8의 첫 번째 하위 선택기에 대한 지원은 nth-child() 기능을 에뮬레이트할 수 있는 기회:

/*li:nth-child(2)*/
li:first-child + li {}
로그인 후 복사

이 접근 방식을 사용하면 두 번째 li 요소에 대한 스타일을 지정하여 nth-child(2)의 동작을 효과적으로 모방할 수 있습니다.

제한 사항:

이 에뮬레이션 트릭은 nth-child(2)와 같은 간단한 선택자에는 작동하지만 nth-child(2n 1) 또는 nth와 같은 더 복잡한 표현식을 처리할 때는 부족합니다. -아이(이상). Internet Explorer 8에는 이러한 선택기의 미묘한 기능을 복제하는 기능이 부족합니다.

위 내용은 Internet Explorer 8에서 nth-child()를 사용하여 테이블에서 Zebra Striping을 어떻게 달성할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿