欧美成人片一区二区三区,久久碰人妻一区二区三区,久久婷婷激情综合色综合俺也去,狂野欧美性猛交免费视频,久久夜色精品国产亚洲

15
2019/06

CSS 選擇器 nth-child 的幾種用法

發(fā)布時間:2019-06-15 13:50:29
發(fā)布者:小逗號
瀏覽量:
0

網(wǎng)站開發(fā)過程中 ,我們經(jīng)常會碰到一些選擇器的要求 比如: 第一項  或者最后一項 ,或者第幾項 ,亦或者隔行  第幾項之后的那些項之類的 下面我們就分別來介紹下。

常見的一些用法就是 第一項  第N項 和 最后一項,這是開發(fā)中常用的選擇要求 寫法如下 :

         first-child        first-child:選擇列表中的第一個標簽。

        nth-child(n)        nth-child(n):選擇列表中的第 n 個標簽。

       last-child        last-child:選擇列表中的最后一個標簽。

還有就是偶數(shù)選擇:

        nth-child(even)         nth-child(even):選擇列表的偶數(shù)行。

        或者另外一種寫法  nth-child(2n);

    奇數(shù)選擇器:

        nth-child(odd)

         nth-child(odd) :選擇列表的奇數(shù)行。

        同樣另外一種寫法nth-child(2n-1).nth-child(2n+1);

上面這些都是開發(fā)中比較常見的一些選擇方法 ,我們還可以 更加靈活的使用nth-child()進行操作;

         nth-child(-n+n)

          nth-child(-n+n):選擇第N個數(shù)之前的項(此處第二個N表示的是具體的數(shù)字)。

          nth-child(-n+n)

          nth-child(-n+n):選擇第N個數(shù)之后的項(此處第二個N表示的是具體的數(shù)字)。

          nth-last-child(n)          nth-last-child(n):選擇倒數(shù)第 n 個元素(此處N表示的是具體的數(shù)字)。

          nth-last-child(n+n)          nth-last-child(n+n):選擇倒數(shù)第 n 個之前的元素(此處第二個N表示的是具體的數(shù)字) 

          nth-last-child(nn)          nth-last-child(3n): 這里選擇的是第3.6.9....項  表示選擇3的倍數(shù)的項。

說了這么多 相信大家已經(jīng)對nth:child選擇器有了更詳細的了解 希望大家能夠熟練應用 提高開發(fā)速度。(濟南文匯軟件 前端開發(fā)工程師為您整理)

關鍵詞:
返回列表