CSS偶數(shù)選擇器是指可以用來選擇HTML文檔中偶數(shù)項(xiàng)的選擇器,它的語(yǔ)法是通過偽類:nth-child(even)
來實(shí)現(xiàn)的。
在使用偶數(shù)選擇器時(shí),我們可以選擇直接給偶數(shù)項(xiàng)設(shè)置樣式,如下所示:
ul li:nth-child(even) { background-color: #ccc; }
上面的代碼表示給所有ul元素中偶數(shù)項(xiàng)的li元素設(shè)置背景顏色為灰色。
有時(shí),我們可能需要給排除某些元素后的偶數(shù)項(xiàng)設(shè)置樣式,這時(shí)可以使用偽類:nth-of-type(even)
,如下所示:
ul li:not(.exclude):nth-of-type(even) { background-color: #ccc; }
上面的代碼表示排除了class為exclude的li元素后,給所有ul元素中剩下的偶數(shù)項(xiàng)設(shè)置背景顏色為灰色。
除了偶數(shù)選擇器,我們還可以使用奇數(shù)選擇器:nth-child(odd)
和:nth-of-type(odd)
來選擇HTML文檔中的奇數(shù)項(xiàng),以及使用:first-child
和:last-child
來選擇第一個(gè)和最后一個(gè)子元素。
上一篇css像框邊
下一篇css像素圓角邊框代碼