：nth-??child()不適用于類，它查找元素本身。您需要使用包裝器來包裝.container div，并使用以下內(nèi)容：

.wrapper div:nth-child(n+3) {

/* put your styles here... */

}

澄清：nth-??child()

使用.container：nth-??child(n 3)可能會(huì)也可能不工作。因?yàn)?#xff1a;nth-??child()偽類表示與選擇器匹配的第n個(gè)子元素(在這種情況下為.container)。

如果.container元素不是其父項(xiàng)的第n個(gè)子元素，則不會(huì)被選中。

The :nth-child(an+b) pseudo-class notation represents an element

that has an+b-1 siblings before it in the document tree, for any

positive integer or zero value of n, and has a parent element.

考慮這個(gè)例子：

1st2nd3rd4th5th6th7th8th9th

在這種情況下，.container：nth-??child(2)將不會(huì)選擇第二個(gè)div.container元素(具有第5個(gè)內(nèi)容)。因?yàn)樵撛夭皇瞧涓疙?xiàng)的第二個(gè)子節(jié)點(diǎn)，而是父節(jié)點(diǎn)的子樹中。

另外，.container：nth-??child(n3)將會(huì)選擇所有的div.container元素，因?yàn)閚從父的子樹中的第一個(gè)元素開始為0，第一個(gè)div.container是其父代的第四個(gè)子節(jié)點(diǎn)。

n starts from 0

n = 0: (0 + 3) = 3 => 3rd element

n = 1: (1 + 3) = 4 => 4th element

n = 2: (2 + 3) = 5 => 5th element

...

因此，div.container：nth-??child(n 3)表示匹配div.container選擇器的所有第3，第4，第5，…子元素。

總結(jié)

以上是生活随笔為你收集整理的html中小于和大于怎么判断,html – CSS nth-child大于和小于的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。