Bạn có thể sử dụng adjacent sibling combinators kết hợp với :first-child
pseudo-class, lặp lại những combinators nhiều lần như bạn cần để đạt được một đứa trẻ thứ n nào đó. Điều này cũng được đề cập trong số an answer to a different question.
Đối với bất kỳ thành phần nào E
, hãy bắt đầu bằng E:first-child
, sau đó thêm + E
cho các trẻ tiếp theo cho đến khi bạn đến được phần tử bạn đang nhắm mục tiêu. Bạn không phải sử dụng cùng một thành phần E
, tất nhiên; bạn có thể chuyển đổi nó ra cho bất kỳ loại, lớp, ID, vv, nhưng các bit quan trọng là các dấu hiệu :first-child
và +
.
Ví dụ, để có được những thứ ba li
của ol
, CSS3 chọn sau đây của nó:
ol > li:nth-child(3)
sẽ được nhân rộng trong CSS2 như vậy:
ol > li:first-child + li + li
Một minh họa:
<ol>
<li></li> <!-- ol > li:nth-child(1), ol > li:first-child -->
<li></li> <!-- ol > li:nth-child(2), ol > li:first-child + li -->
<li></li> <!-- ol > li:nth-child(3), ol > li:first-child + li + li -->
<li></li> <!-- ol > li:nth-child(4), ol > li:first-child + li + li + li -->
</ol>
Lưu ý rằng kể từ there are no sibling combinators that look at preceding siblings (không phải trong CSS2 hoặc CSS3), bạn không thể mô phỏng :nth-last-child()
hoặc :last-child
bằng cách sử dụng bộ chọn CSS2.
Ngoài ra, bạn chỉ có thể mô phỏng :nth-child(b)
cho một trẻ cụ thể tại một thời điểm, trong đó b
là số không đổi trong công thức an+b
(như được mô tả trong spec); bạn không thể đạt được bất kỳ công thức phức tạp nào với các combinators anh chị em liền kề một mình.