这样理解对吗???

这样理解对吗???

Elements为当前元素集合;
   Elements:first-child  首个
   Elements:nth-child(n)
n为当前元素集合与所有同级元素集合位置。

正在回答

登陆购买课程后可参与讨论,去登陆

3回答

你好,:nth-of-type(n) 选择器是匹配属于父元素的特定类型的第 N 个子元素的每个元素。

这个与nth-child(n)有点绕,建议:可参考如下代码,测试理解下。

<!DOCTYPE html>
<html>
<head>
    <style>
        p:nth-child(3){
            background: red; /*属于其父元素的第三个子元素的每个p (这里是第三个子元素即可)*/
        }
        p:nth-of-type(3){
            background: blue;  /*属于其父元素的第三个p元素的每个p (这里必须要是第三个p元素,也就是说,前面必须有两个p元素)*/
        }
    </style>
</head>
<body>
    <h1>标题</h1>
    <span>span标签</span>
    <p>第一个p标签</p>
    <p>第二个p标签</p>   
    <p>第三个p标签</p>
    <p>第四个p标签</p>
</body>
</html>

祝学习愉快~

提问者 纯情掉了一地 2017-12-21 23:36:52

Elements:first-child{

         // Elements父级元素子集合中 首个标签元素

}

Elements:nth-child(n){

        //  Elements父级元素子集合中 第n个标签元素

}

Elements:nth-of-type(n){

        //  Elements元素集合中 第n个标签元素

}

这样差不多了

好帮手慕糖 2017-12-21 20:40:20

你好,不太能理解你的意思,不过这里,:first-child 选择器用于选取属于其父元素的首个子元素的指定选择器。

:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。可以参考下与你的理解是否是相同的,若不同建议:可详细描述下,便于大家理解。

祝学习愉快~

  • 提问者 纯情掉了一地 #1
    谢谢 我有了新的描述 和理解
    2017-12-21 23:40:11
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师