css实现效果隔行变色

主要需要使用到结构伪选择器

E:nth-child(n) n可以是数字(1,2,3),关键字(odd,even),公式(2n,2n+3),数字是从1开始的,不是0.如:
tr:nth-child(3)匹配所有表格里第3行的tr
tr:nth-child(2n+1)匹配所有表格的奇数行
tr:nth-child(2n)匹配所有的偶数行
tr:nth-child(odd)匹配所有的奇数行
tr:nth-child(even)匹配所有的偶数行

eg: li:nth-of-type(odd){background:red;}/奇数行/
li:nth-of-type(even){background:yellow;}/偶数行/

E:nth-last-child(n) 它是父元素的倒数第n个子元素

E:nth-of-type(n) 它是父元素所有子元素中类型为E的子元素集合中的第n个

E:nth-last-of-type(n) 它是父元素的倒数第n个子节点

E:last-child 它是父元素中的最后一个字节点

E:first-of-tpe 它是父元素中是第一个该类型的元素

E:last-of-type 它是父元素中的最后一个该类型的元素

E:only-child 找出父元素中只包括一个的子元素,且该元素是E

E:only-of-type 选择其父元素只包含一个同类型的子元素,且该子元素匹配E

E:empty 匹配E元素,且该元素不包含子节点,注意,文字也属于节点