如何在 Internet Explorer 8 中模拟 :nth-child？

Linda Hamilton

发布： 2024-11-16 04:49:02

原创

688 人浏览过

How Can I Emulate :nth-child in Internet Explorer 8?

在 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中文网其他相关文章！

来源：php.cn

上一篇：为什么迁移到 Bootstrap 4 后我的列无法正确对齐？下一篇：如何在下拉选项中显示图片？

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

作者最新文章