CSS3集合包含以下四个选择器:
E:first-child /*选择E元素的第一个子元素*/ E:last-child /*选择E元素的最后一个子元素*/ E:nth-child(n) /*选择E元素的第n个子元素*/ E:nth-of-type(n) /*选择E元素的第n个类型为E的子元素*/
下面是一些使用示例:
/*选择表格中第一行(即表头)的背景颜色*/ tr:first-child { background-color: gray; } /*选择ul元素中第一个li元素的文字颜色*/ ul li:first-child { color: red; } /*选择ol元素中第二个子元素的文字颜色*/ ol li:nth-child(2) { color: blue; } /*选择div元素中第二个类型为p的子元素的文字颜色*/ div p:nth-of-type(2) { color: green; }
需要注意的是,CSS3集合只能选择子元素,不能选择父元素或其他非子元素。此外,浏览器兼容性也需要考虑,某些旧版本的浏览器可能不支持CSS3集合。所以在使用时,应该进行充分的测试和兼容性考虑。