CSS第一个孩子选择器问题

<style type="text/css"> 
p:first-child 
{ 
background:yellow; 
} 
</style> 


<i></i> 
<p>I am a strong man. I am a strong man.</p> 
<p>I am a strong man. I am a strong man.</p> 
<p>I am a strong man. I am a strong man.</p>

为什么如果我把一个元素放在“p”行之前，我看不到第一行黄色？应该p：第一个孩子选择第一个“p”而不仅仅是第一个标签？CSS第一个孩子选择器问题

感谢

来源

2011-04-05 Francesco

:first-child不关心类型。通过将<i></i>添加到您的代码中，i成为第一个孩子（假设<style>在<head>之内，其余的在<body>当然）。您的选择器想要匹配p，但由于p不再是第一个孩子，因此您的风格无法应用。

如果你想按类型进行过滤，使用CSS3 :first-of-type伪类：

p:first-of-type 
{ 
    background:yellow; 
}

来源

2011-04-05 07:52:52 BoltClock

它的工作原理在旧的浏览器？ – Francesco 2011-04-05 08:15:30

我真的发现myslf它可能更容易包装在父包装div中的元素，并指定在CSS中...它的工作原理.. – Francesco 2011-04-05 08:16:24

@camelCase：不是真的。是的，你最好将'p'元素包装在'div'中。无论如何，在一系列'p'之前拥有'i'并没有什么意义。 – BoltClock 2011-04-05 08:17:18

CSS第一个孩子选择器问题

回答

相关问题