/*选择2的倍数的写法*/ :nth-child(2n){ /*选择属性*/ }
其中,:nth-child(2n)
表示选择所有在其父元素中是偶数位置的元素,1、3、5…都不会被选中。大家可以通过给偶数项设置不同的背景色或文本样式等来区分与奇数项不同的样式。例如:
li:nth-child(2n){ background-color: gray; } li:nth-child(2n+1){ /*选择奇数项*/ background-color: white; }
通过这样的选择器,大家可以很容易地让列表中的偶数项获得一种不同于奇数项的视觉效果。同时,这种选择器也可以应用于其他元素中,比如表格的行或列等,让页面呈现出更加直观清晰的视觉效果。