css選擇器 nth child 的用法

:nth-child() 選擇器，該選擇器選取父元素的第 n 個子元素，與型別無關。

:nth-last-child(n) 選擇器匹配屬於其元素的第 n 個子元素的每個元素，不論元素的型別，從最後乙個子元素開始計數。

/*選擇列表中的倒數第n個標籤 n為數字*/

:nth-last-child
(n)/*選擇倒數最後n個*/
item:nth-last-child(-n+2)

p:nth-of-type(2)

>

>
這是標題h1
>
>
第乙個段落。p
>
>
測試div
>
>
第二個段落。p
>
>
第三個段落。p
>
>
第四個段落。p
>
>
第五個段落。p
/* 選擇第n個，n位數字  */
:nth-child
(n)/* 選擇列表中的偶數標籤 */
:nth-child
(2n)
/*選擇列表中的奇數標籤 */
:nth-child
(2n-1)
/*選擇前幾個元素 */
/*【負方向範圍】選擇第1個到第6個 */
:nth-child(-n+6)
/*從第幾個開始選擇*/
/*【正方向範圍】選擇從第6個開始的，直到最後  */
:nth-child(n+6)
/*兩者結合使用，可以限制選擇某乙個範圍 */
/*【限制範圍】選擇第6個到第9個，取兩者的交集【感謝小夥伴的糾正~】 */
:nth-child
(n+6)
:nth-child
(-n+9)
/*選擇列表中的倒數第n個標籤 n為數字 */
:nth-last-child
(n)/*選擇倒數最後n個 */
item:nth-last-child(-n+2)

CSS3的nth child 選擇器

nth child 瀏覽器支援 ie9及以上版本，火狐，谷歌，safari opera都支援！nth child n 選擇器匹配屬於其父元素的第 n個子元素，不論元素的型別。p nth child 2 將匹配body的第二個元素 不要把 nth child 和 nth of type 混淆。css3...

css3 選擇器 nth child 選擇問題

nth child 是乙個偽類選擇器，它並不會按照標籤的順序進行選擇，而是按照順序進行選擇 例子 doctype html p nth child 8 先根據順序選擇第8行，在檢查它是否是p元素，如果是p就是紅色，父元素是body style head 這是標題 h1 1第乙個段落。p 2第二個段落...

CSS3的nth child選擇器的使用

first child first of type last of type only of type only child nth child n nth last child n nth of type n nth last of type n last child nth child研究開始 ...