在使用偶数选择器时,大家可以选择直接给偶数项设置样式,如下所示:
ul li:nth-child(even) { background-color: #ccc; }
上面的代码表示给所有ul元素中偶数项的li元素设置背景颜色为灰色。
有时,大家可能需要给排除某些元素后的偶数项设置样式,这时可以使用伪类:nth-of-type(even)
,如下所示:
ul li:not(.exclude):nth-of-type(even) { background-color: #ccc; }
上面的代码表示排除了class为exclude的li元素后,给所有ul元素中剩下的偶数项设置背景颜色为灰色。
除了偶数选择器,大家还可以使用奇数选择器:nth-child(odd)
和:nth-of-type(odd)
来选择HTML文档中的奇数项,以及使用:first-child
和:last-child
来选择第一个和最后一个子元素。