                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

关于子选择器应用的问题

一个关于子选择器的问题
p span{color:purple;}
<p class="first">一二<span>三</span>四五六七八</p>
此时应该是3显示紫色
<p class="first">一二<span>三</span>四五<span>六</span>七八</p>
此时三、六均为紫色
>是子选择器、不是说标签下的第一个子元素变化吗？那为什么把p span{color:purple;}改为.first>span{color:purple;}后，六还是变成了紫色？

SmileDL

2016-03-16

源自：初识HTML(5)+CSS(3)-升级版 9-3

关注问题我要回答

509

操作

收起

5 回答

一湘回答被采纳 +3 积分
2016-03-16

<p class="first">一二<span>三</span>四五<span>六</span>七八</p>

这一行的两个<span>标签属于并列子一代，都是第一代子元素，所以六还是紫色的。

而<p class="first">一二<span>三<span>四五</span>六</span>七八</p> 这一行才只有一个子一代元素。

总之：要理解为一代子元素，而不是第一个子元素，明白吗？

0 回复有任何疑惑可以回复我~

#1

SmileDL 提问者

晓得了，是我理解错了，非常感谢

2016-03-17 回复有任何疑惑可以回复我~

慕移动9181930
2022-03-29

这貌似是C语言的写法吧，和HTML没什么关系

y w w a g n b v b e a y d u q e f f n i g i g d w g q d u h g v e r u u w d f h c o x h m z w q g f o b r w s y u j u d x o b

0 回复有任何疑惑可以回复我~

流浪世界
2016-03-16

这两个的span的关系并不是后代的关系，你可以理解为他是这两个span都是一个爸爸，并不是你理解的first是第一个span的爸爸，第二个span的爷爷，这两个span他们的关系是并列关系

0 回复有任何疑惑可以回复我~

#1

SmileDL 提问者

明白了，谢谢哈~

2016-03-17 回复有任何疑惑可以回复我~

qq_loserandhisc_0
2016-03-16

同学可能你把第一个的意思理解错了。第一个在这里的意思是第一层，也就是说第一个指的是这个标签内部第一层次的所有标签，而不是顺序上的第一个。煮个栗子：父亲p下面有两个儿子span，这两个儿子就是同一个层次的。而像楼上这样写的话，就是一个儿子span和一个孙子span啦~

1 回复有任何疑惑可以回复我~

#1

SmileDL 提问者

OK，谢谢前辈~

2016-03-17 回复有任何疑惑可以回复我~

传说中传说
2016-03-16

.first>span是直接子元素吧，如果是下面这样应该就不行了，六就不是直接子元素了

<p class="first">一二<span>三<span>六</span></span>四五七八</p>

0 回复有任何疑惑可以回复我~

#1

SmileDL 提问者

OK了，谢谢谢谢哈！

2016-03-17 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

初识HTML(5)+CSS(3)-升级版

参与学习 1225793 人
解答问题 18234 个

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

本课相似问答

3 回答关于子选择器的问题

3 回答关于子选择器的问题

2 回答关于子选择器和包含选择器的问题

5 回答子选择器的应用

3 回答关于子选择器的小问题

搜索更多本课相关问答

关于子选择器应用的问题

我要回答关注问题

意见反馈帮助中心 APP下载