nth-child()疑问

    <h2>慕课网欢迎您</h2>
    <p>http://www.imooc.com</p>
    <p>慕课网</p>
    <p>慕课网</p>

<h2>慕课网欢迎您</h2>

p:nth-child(1){
background-color: red;
}

为何（1）无结果显示，而（2）的时候才显示-http://www.imooc.com-红背景色。（）中数字计数不是从这个元素-p--http://www.imooc.com-第一个子元素开始算吗？

黑不溜溜球 2019-08-18

源自：CSS入门 4-4 伪类分类

收起

1回答

好帮手慕阿满回答被采纳获得+3积分 2019-08-18 18:09:03

同学你好，nth-child(2)是所有语句的第2行，如果这一行正好是p标签，则设置背景色，如果不是p标签，则无效。所以如果是nth-child(1)，第一行是h2标签，不是p标签，无效果，如果是nth-child(2)，第二句正好是p标签<p>http://www.imooc.com</p>，这句话会显示背景色。

如果我的回答解决了你的疑惑，请采纳。祝：学习愉快~

收起回答