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

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 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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

어떤 사람들은 CSS-in-JS의 아이디어를 완전히 싫어합니다. 그 이름은 불쾌합니다. 힘든 아니요. 스타일링은 JavaScript에 속하지 않으며 CSS에 속합니다.

Google Pagespeed의 작동 방식 : 점수 및 검색 엔진 순위 향상Google Pagespeed의 작동 방식 : 점수 및 검색 엔진 순위 향상Apr 18, 2025 am 10:03 AM

이 기사에서는 PagesPeed가 중요한 속도 점수를 계산하는 방법을 밝혀냅니다. 속도가 수익을 높이고 포기 율을 낮추는 데 중요한 요소가 된 것은 비밀이 아닙니다. 이제 Google은 페이지 속도를 순위 요소로 사용하므로 많은 Orga

SVG로 현실적인 유리 효과를 만듭니다SVG로 현실적인 유리 효과를 만듭니다Apr 18, 2025 am 10:01 AM

나는 SVG와 사랑에 빠졌다. 물론, 코드는 처음에는 조밀하고 어려워 보일 수 있지만, 결과를 알게 될 때 결과의 아름다움을 볼 수 있습니다. 보너스는입니다

주간 플랫폼 뉴스 : 그림 요소로 이미지로드 방지, 우리가 원하는 웹, SVG 스타일은 범위가 없습니다.주간 플랫폼 뉴스 : 그림 요소로 이미지로드 방지, 우리가 원하는 웹, SVG 스타일은 범위가 없습니다.Apr 18, 2025 am 09:57 AM

이번 주에 그림 요소를 사용하여 이미지를 조건부로로드하기위한 트릭 인 Browser News의 주간 라운드 업, Bowser 공급 업체에 대해

NetLify Forms 및 NetLify 기능을 사용하여 이메일 가입 위젯을 구축합니다.NetLify Forms 및 NetLify 기능을 사용하여 이메일 가입 위젯을 구축합니다.Apr 18, 2025 am 09:54 AM

자신의 웹 사이트를 구축하고 유지 관리하는 것은 좋은 생각입니다. 당신은 당신의 플랫폼을 소유 할뿐만 아니라 그 과정에서 웹 기술을 실험 할 수 있습니다.

주간 플랫폼 뉴스 : CSS 글꼴 스타일 : 비스듬한, Webhint 브라우저 확장, CSS 모듈 V1주간 플랫폼 뉴스 : CSS 글꼴 스타일 : 비스듬한, Webhint 브라우저 확장, CSS 모듈 V1Apr 18, 2025 am 09:53 AM

이번 주에 라운드 업에서 가변 글꼴은 경사, 라인을위한 새로운 브라우저 확장 및 첫 번째 버전의 CSS 모듈을 얻습니다.

대화식 웹 응용 프로그램을 구축하는 데 Mavo가 빛나게하십시오대화식 웹 응용 프로그램을 구축하는 데 Mavo가 빛나게하십시오Apr 18, 2025 am 09:50 AM

제목에서 추측 할 수 있듯이이 튜토리얼은 Mavo에 전념합니다.

확신확신Apr 18, 2025 am 09:49 AM

David Desandro는 수년 동안 만든 수많은 멋진 JavaScript 라이브러리를 가지고 있습니다. 그의 최신작은 "원형, 평평한 디자이너 친화적 인 의사 3D 인 Zdog입니다

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

SecList

SecList

SecLists는 최고의 보안 테스터의 동반자입니다. 보안 평가 시 자주 사용되는 다양한 유형의 목록을 한 곳에 모아 놓은 것입니다. SecLists는 보안 테스터에게 필요할 수 있는 모든 목록을 편리하게 제공하여 보안 테스트를 더욱 효율적이고 생산적으로 만드는 데 도움이 됩니다. 목록 유형에는 사용자 이름, 비밀번호, URL, 퍼징 페이로드, 민감한 데이터 패턴, 웹 셸 등이 포함됩니다. 테스터는 이 저장소를 새로운 테스트 시스템으로 간단히 가져올 수 있으며 필요한 모든 유형의 목록에 액세스할 수 있습니다.

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

ZendStudio 13.5.1 맥

ZendStudio 13.5.1 맥

강력한 PHP 통합 개발 환경