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){}
從第幾個開始選擇
/*【正方向範圍】選擇從第6個開始的，直到最後 */
:nth-child(n+6){}
選擇列表中的倒數第n個標籤 n為數字
:nth-last-child(n)

需要設定前3個元素的margin-top值與其他的不同。

div:nth-child(-n+3)

first-child表示選擇列表中的第乙個標籤

例： li:first-child
last-child表示選擇列表中的最後乙個標籤
例： li:last-child

css中合理的使用nth child實現布局

寫這篇文章的目的，主要是今天要實現乙個布局 li，每行三個，總數不定，只能相鄰的li之間需要10px的間距，效果如下圖 大家可以先自己實現一下，我這裡也是思考了很久，最後整理了思緒，發現先給每個li新增margin right 10px 然後給第3n個加上margin bottom 10px 並且去...

css中合理的使用nth child實現布局

寫這篇文章的目的。主要是今天要實現乙個布局 li。每行三個，總數不定。僅僅能相鄰的li之間須要10px的間距。效果例如以下圖 大家能夠先自己實現一下，我這裡也是思考了非常久，最後整理了思緒，發現先給每乙個li加入margin right 10px 然後給第3n個加上margin bottom 10p...

詳解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 ch...