代码实例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
li:first-child
{
background:yellow;
}
</style>
</head>
<body>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ol>
<p><b>注意:</b> :first-child作用于IE8以及更早版本的浏览器, DOCTYPE必须已经声明</p>
</body>
</html> 尝试一下 »
点击“尝试一下”按钮查看在线实例
定义和用法
:first-child选择器匹配第一个子元素。
:first-child是一个伪类，它适用于任何元素，它是另一个元素的第一个子元素。
使用:first-child伪类，一个元素只有当它是另一个元素的第一个子元素时才匹配。例如，p:first-child将选择作为某个其他元素的第一个子元素的任何p元素。如果要选择段落的第一个子元素，我们可以使用p>*:first-child。
例子：
body *:first-child {font-weight: bold;}
p:first-child {font-size: 125%;}注意: :first-child在IE8和更早版本IE版本中必须声明<!DOCTYPE>
