CSS3 选择器nth-child()问题，谢绝抢答，求懂的大神。
不要抢答，不要抢答！不要去复制别人的，我知道这问题很简单，但是我刚刚学习就是不懂。下面的我初次学习CSS3，选择器这里，怎么样才能让第一个DIV是蓝色，第二个是橙色，第三...
不要抢答，不要抢答！不要去复制别人的，我知道这问题很简单，但是我刚刚学习就是不懂。下面的 我初次学习CSS3，选择器这里，怎么样才能让 第一个DIV是蓝色，第二个是橙色，第三个是绿色，而第三个DIV里面的 3-1、3-2 没有样式。下面的代码运行了之后，第三个DIV获取不到child（3）的样式，反而3-1获取了child（1）、3-2获取了child（2）<!DOCTYPE html><html> <head> <style>div:nth-child(1) { background:#78caf1; /*蓝*/}div:nth-child(2) { background:#ffc04c; /*橙*/}div:nth-child(3) { background:#33bf51; /*绿*/}</style></head> <body> <div>2</div> <div>2</div> <div> <div>3-1</div> <div>3-2</div></div> </body></html>
百度知道提问把代码格式个打乱了，不是我搞得，看起来比较费劲，请谅解。
另外，这个问题刚刚我提交了一遍，被一个家伙给抢答了，然后就不推送了，知道怎么解决的，能提供正确答案，可以点击我发的问题里面找到这个问题，一起回答一下，我一起采纳 ，一共510财富值，谢谢了，也请不能帮我解决问题的大哥不要抢了。 展开
百度知道提问把代码格式个打乱了，不是我搞得，看起来比较费劲，请谅解。
另外，这个问题刚刚我提交了一遍，被一个家伙给抢答了，然后就不推送了，知道怎么解决的，能提供正确答案，可以点击我发的问题里面找到这个问题，一起回答一下，我一起采纳 ，一共510财富值，谢谢了，也请不能帮我解决问题的大哥不要抢了。 展开
2个回答
展开全部
nth-child()括号里面的顺序号是指“兄弟姐妹”之间的序号，并不是整个家族不分辈分的序号。在你的代码中，第一个div和第二个div是兄弟关系，它们的序号是1和2，所以它们分别获得了第1个和第2个样式，而3-1和3-2这两个div则是前两个div的“侄子”（它们外面所套的那个div则是它们的“父亲”），所以它们的序号会重新分配为1和2，并分别匹配第1和第2个样式。听懂没有？
改成这样就行：
<style>
body>div:nth-child(1) {background:#78caf1; /*蓝*/}
body>div:nth-child(2) {background:#ffc04c; /*橙*/}
div>div:nth-child(1) {background:#33bf51; /*绿*/}
</style>
追问
非常感谢
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
