詳解CSS中 nth child的用法

tips：還用低版本的ie瀏覽器的哥們請繞過！

:nth-child(2)選取第幾個標籤，「2可以是你想要的數字」

.demo01 li:nth-child(2)

:nth-child(n+4)選取大於等於4標籤，「n」表示從整數，下同

.demo01 li:nth-child(n+4)

:nth-child(-n+4)選取小於等於4標籤

.demo01 li:nth-child(-n+4)

:nth-child(2n)選取偶數標籤，2n也可以是even

.demo01 li:nth-child(2n)

:nth-child(2n-1)選取奇數標籤，2n-1可以是odd

.demo01 li:nth-child(2n-1)

:nth-child(3n+1)自定義選取標籤，3n+1表示「隔二取一」

.demo01 li:nth-child(3n+1)

:last-child**選取最後乙個標籤**

.demo01 li:last-child

:nth-last-child(3)選取倒數第幾個標籤,3表示選取第3個

.demo01 li:nth-last-child(3)

ok，:nth-child的這些用法在實際中很用得著，不用單獨給需要選取的標籤加上id或class

詳解CSS中 nth child的用法

前端的哥們想必都接觸過css中乙個神奇的玩意，可以輕鬆選取你想要的標籤並給與修改新增樣式，是不是很給力，它就是 nth child 下面我將用幾個典型的例項來給大家講解 nth child的實際用途 tips 還用低版本的ie瀏覽器的哥們請繞過！demo01 li nth child 2 點此檢視例...

詳解CSS中 nth child的用法

前端的哥們想必都接觸過css中乙個神奇的玩意，可以輕鬆選取你想要的標籤並給與修改新增樣式，是不是很給力，它就是 nth child tips 還用低版本的ie瀏覽器的哥們請繞過！demo01 li nth child 2 點此檢視例項展示 demo01 li nth child n 4 點此檢視例項...

CSS中 nth child 的使用

選擇第n個，n位數字 nth child n 選擇列表中的偶數標籤 nth child 2n nth child even 選擇列表中的奇數標籤 nth child 2n 1 nth child odd 選擇前幾個元素 負方向範圍 選擇第1個到第6個 nth child n 6 從第幾個開始選擇 正...