解决ie8 css :nth-child(3n) 不兼容问题

个人是用jquery 做的

在css中 一般这样写

.css li:nth-child(3n){

    width:300px;

}

方法一:使用 + 来硬干nth-child()

遇到IE7、IE8的时候可以这样写

.css >li+li+li{

    width:300px;

}

或是这样

.css >first-child + li + li{

    width:300px;

}

方法二:使用JQuery解决IE8不支持CSS3的nth-child()问题


jQuery :nth-child() 选择器的使用方法和 CSS3 的:nth-child()没什么两样,兼容性不必担心。

  • :nth-child(odd)用于匹配奇数子元素

  • :nth-child(even)用于匹配偶数子元素

  • :nth-child(n)用于匹配第n个元素

  • :nth-child(an)用于匹配倍数为a的元素,如3n、5n…

  • 可以是一个公式,如:nth-child(3n+1)匹配第1、第4、第7…个元素

  • :nth-child(-n+3)匹配前3个元素

  • :nth-child(-3n+8)匹配第8、第5、第2个元素

判断是否为 IE8 浏览器,然后执行代码,实例:



发布了29 篇原创文章 · 获赞 3 · 访问量 5万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览