child选择器的语法是:父元素 >子元素。
父元素 >子元素 { 属性: 值; }
使用child选择器的好处是大家可以只对特定的子元素添加样式,而不会影响到其他的子元素。例如,大家有一个ul列表,里面有很多li子元素。大家只想要对第一个li元素改变颜色,大家就可以使用child选择器。
ul >li:first-child { color:red; }
上述代码中,只有第一个li元素会被改变颜色,而其他的li元素则不受影响。
除了:first-child,大家还可以使用:last-child、:nth-child(n)等伪类来选择子元素。其中,:nth-child(n)可以选择到指定子元素,例如从第二个开始选择:
ul >li:nth-child(n+2) { font-size: 20px; }
上述代码中,从第二个li元素开始,字体大小为20px。
总之,child选择器是一种非常有用的选择器,可以让大家对一个元素的特定子元素进行样式修改。