很多时候我们在操作表格上,都会遇到修改样式问题,比如只需要改变表头颜色,那么设置th即可,只改变单个表格,设置内嵌样式或class即可。
table样式、表格样式
设置某一行(横向),只修改tr即可,今日遇到一个这样的问题,如果设置某一列所有颜色改变呢,比如有8个列,我需要将2的倍数或4的倍速的列背景色或字体改变(纵向),笨方法是增加一个class样式,然后在每一个td上进行加入class,当然这种方法也是很有效果的,对付小数据的表格没问题,但是,如果我的表数据很多,这时候的工作量也是挺大的,所以,下面这段CSS3代码很好的解决这种问题
<style>table td:nth-child(4n){background-color:whitesmoke}</style>
结果图
除了上面的一个示例,还有其他语法类似比如
':eq(index)' 只匹配一个元素,而这个将为每一个父元素匹配子元素。
:nth-child从1开始的,而:eq()是从0算起的!可以使用:
:nth-child(even)
:nth-child(odd)
:nth-child(3n)
:nth-child(2)
:nth-child(3n+1)
:nth-child(3n+2)