點擊右上方紅色按鈕關注「小鄭搞碼事」，每天都能學到知識，搞懂一個問題！

CSS3有太多特性可以關注的，其中nth-child這個選擇器就是當中最值得關注的特性之一，之前，我寫過一篇文章，當中用了兩句話來搞了一下nth-child和nth-of-type的區別， 今天，這篇我們重點來關注一下nth-child的常規應用，看有哪些是你沒有用到的。

一， 選擇第幾個標籤

例如選擇第2個標籤，可以這麼搞：

ul li：nth-child(2){color:red}

二，選擇小於等於5標籤

其中n表示從整數，注意，這個時候用的是-n，如下

效果就是下面這樣：

三，選擇大於5標籤

其中n表示從整數，注意，這個時候用的是n，如下

效果就是下面這樣的：

四，選擇偶數標籤

其中2n也可以是even。

效果下面這樣：

五，選擇奇數標籤

其中2n-1也可以是odd。

效果如下：

六，自定義選取標籤（隔二取一）

效果是這樣的：

七，選取最後一個標籤

ul li：last-child{color：red}

或者選擇倒數第幾個標籤：

ul li：last-child（3）{color：red}

最後總結一下：

關於nth-child這些用法，大部分應該都用過，特別要注意第二個連續選取的用法。有時候用對了，會幫你省好多代碼。

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！