解決ie8 css :nth-child(3n) 不相容問題
阿新 • • 發佈:2019-02-14
個人是用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個元素