/* 将ul元素的第一个li标签的文字颜色设为红色 */ ul li:first-child { color: red; }
使用:first-child伪类也可以实现对某个元素的第一个子元素进行特殊处理。比如,大家可以将表格中第一列的字体加粗,或者将第一个段落元素的文本的背景色设置为黄色。
/* 将table元素中第一列的字体加粗 */ table tr td:first-child { font-weight: bold; } /* 将文本的背景色设为黄色 */ p:first-child { background-color: yellow; }
除了:first-child,CSS中还有:last-child、:nth-child等伪类可以用来匹配元素的子元素。掌握这些伪类可以帮助大家更好地利用CSS来控制网页元素的样式。