Internet Explorer 8에서 :nth-child를 어떻게 에뮬레이션할 수 있나요?

Internet Explorer 8에서 :nth-child 에뮬레이션

Internet Explorer 8에서는 문제가 될 수 있는 :nth-child 선택기에 대한 지원이 부족합니다. 상위 요소 내의 위치를 ​​기준으로 요소의 스타일을 지정하려고 할 때 이러한 경우에는 대체 솔루션이 필요합니다.

다행히 인접한 형제 연결자( )를 활용하면 IE7과 IE8에서 비슷한 결과를 얻을 수 있습니다. 예를 들어 다음 CSS 조각은 다음과 같습니다.

#nav-primary ul li:first-child a {
    border-top: 5px solid red;
}
/* ... */
#nav-primary ul li:first-child + li + li a {
    border-top: 5px solid green;
}

다음과 동일합니다:

#nav-primary ul li:nth-child(1) a {
    border-top: 5px solid red;
}
/* ... */
#nav-primary ul li:nth-child(3) a {
    border-top: 5px solid green;
}

그러나 이 기술은 :nth-child(의 더 복잡한 변형을 에뮬레이트할 수 없다는 점에 유의하는 것이 중요합니다. )(예: :nth-child(odd) 또는 :nth-child(4n 3))

위 내용은 Internet Explorer 8에서 :nth-child를 어떻게 에뮬레이션할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!