CSS身体:第一个孩子

Xen*_*eno 7 html css css-selectors

有人可以向我解释为什么这不起作用?

<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>
Run Code Online (Sandbox Code Playgroud)

根据我的阅读,第一个子选择器应该从body标签中选择第一个div对象.如果它没有选择div元素,它选择什么?

Mus*_*usa 14

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

body > :first-child{
    color:#f00;
}
Run Code Online (Sandbox Code Playgroud)

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


Rod*_*eas 8

要定位第一个div,您需要这样做body div:first-child.现在(我假设)你只是选择了第一个孩子的身体.(实际上我并不完全确定你现在正在选择什么,开始考虑它.我认为first-child选择器无法直接挂在body标签上.)

body div:first-child {
    color:#f00;
}?
Run Code Online (Sandbox Code Playgroud)

这个CSS将按照您的预期对其进行着色.把它读成"身体第一个孩子的div".

  • @Xeno:`:first-child`的意思是“如果它是第一个孩子,则选择此元素”,而不是“选择此元素的第一个孩子”。 (2认同)