CSS身体：第一个孩子

问题描述：

有人可以向我解释为什么这不起作用吗？CSS身体：第一个孩子

<html> 
<head> 
    <style> 
    body:first-child 
    { 
     color:#f00; 
    } 
    </style> 
</head> 
<body> 
    <div>I should be red.</div> 
    <div>This is not red.</div> 
</body> 
</html>

从我读到的，第一个孩子的选择器应该从body标签中选择第一个div对象。如果它没有选择div元素，它选择了什么？

不要忘了包括 –

答

要定位第一个div，您需要执行body div:first-child。现在（我认为）你只是选择了第一个孩子的身体。（其实我不是很确定你现在选择什么权，想起来了。我不认为first-child选择是有效的，直接在身上的标签挂）

body div:first-child { 
    color:#f00; 
}

这个CSS会按照你的期望着色。阅读它作为“身体的第一个孩子的div”。

也许我有点困惑至于第一胎儿选择器。我认为它更像是“身体内div的第一个孩子”。如果我想选择身体中的最后一个孩子，那么我会使用： 'body div：last-child'？ – Xeno

是的，但这只会得到最后的* div *孩子。 –

@ Xeno：'：first-child'的意思是“如果它是第一个孩子，选择这个元素”，而不是“选择这个元素的第一个孩子”。 – BoltClock

答

在body:first-child的:first-child伪类对身体标记工作，所以它的身体标记，是其父母的第一个孩子将要选择，如果你想body的第一个孩子使用child selector

body > :first-child{ 
    color:#f00; 
}

这会给你身体的第一个孩子。

这在DNN中适用于我。设置中的模块通常具有teleric或tinyMCE组件，并且其描述字段中的主体标签将呈现实际站点主体的样式。超级讨厌，但这有助于解决这个问题。 – GomezJr

答

你的CSS是说选择任何BODY元素，它是它的父元素的第一个子元素，它将是HTML元素。 BUt HEAD是不是BODY的第一个孩子。

至少我认为这是正确的:-)

答

要定位的body你可以使用这个第一div，

body div:first-of-type { 
    /* style */ 
}

CSS身体：第一个孩子

相关推荐