CSS的nth-Child(数字)选择器未应用

Question

我试图在600*600div内放置3个矩形div。分离为25像素。我的第一个代码效果很好。但是，当我尝试应用nth-child（1）和nth-child（2）时，它就无法正常工作。

https://jsfiddle.net/user1989/l20fn90l/

如果我将样式部分更改为

#two-parent :nth-child(0){
margin-top:25px;
width:200px;
height:200px;
background-color : black;
float:left;
}
#two-parent :nth-child(1){
margin-top:25px;
position:relative;
width:200px;
height:200px;
background-color : orange;
margin-left:25px;
float:left;
}

未应用子选择器。

Answer 1

您正在使用Div作为儿童容器，这些CSS声明应完成工作：

#two-parent div:nth-child(1) { /** :nth-child(1) for 1st child  **/
  /** Declaration **/
}
#two-parent div:nth-child(2) { /** :nth-child(2) for 2nd child **/
  /** Declaration **/
}

Answer 2

您必须选择一个 @den说的元素：尝试：https：//jsfiddle.net/3bpjxec0/

#box .b:nth-child(1) b {
  font-size:14px;
}