为了账号安全,请及时绑定邮箱和手机立即绑定

为什么我把li改成了ul,就没有反应了,然后我把>换成了空格,才有了红框框,,不理解

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>子选择符</title>
<style type="text/css; disc">
.food>ul{border:1px solid red;}/*添加边框样式(粗细为1px, 颜色为红色的实线)*/
.first>span{border:1px solid red;}
</style>
</head>
<body>      
<p
 
class="first">三年级时,<span>我还是一个<span>胆小如鼠</span>的小女孩</span>,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<h1>食物</h1>
<ul class="food">
    <li>水果
        <ul>
            <li>香蕉</li>
            <li>苹果</li>
            <li>梨</li>
        </ul>
    </li>
    <li>蔬菜
        <ul>
            <li>白菜</li>
            <li>油菜</li>
            <li>卷心菜</li>
        </ul>
    </li>
</ul>
</body>
</html>


正在回答

4 回答

因为你用子选择器这个大于号时,样式指定的是food类直属的元素,li是直属元素所以会改变,但这里面ul是从属于li之下的元素,直属于li,不是直属于food类,就不会在>命令下改变。而用空格则指定给了所有在这个类范围内的子标签,即使是间接的。所以ul这时会被改变。

其实欧洲封建制度跟>的方式很像,我的附庸的附庸不是我的附庸。。而中国集权制度跟空格的方式很像,我手下的手下都是我的手下

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

只是空穴何来风

经典。
2017-02-07 回复 有任何疑惑可以回复我~
#2

辣椒加冰 提问者

非常感谢!
2017-02-07 回复 有任何疑惑可以回复我~
#3

辣椒加冰 提问者

当时突然没转过来弯儿,看了你见解之后更加清楚了,这比喻很形象,谢谢!
2017-02-07 回复 有任何疑惑可以回复我~
#4

慕粉0928522411

这解释简直完美
2017-02-24 回复 有任何疑惑可以回复我~
查看1条回复

首先把  第六行把  ;disc   去掉就行了

其次  因为首个ul元素在body程序中不是food函数的子代元素,可以理解为并列元素,li才是,而除掉首个的ul元素才是子代元素,因此在你将>改为空格键后才会显示

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

辣椒加冰 提问者

disc是什么意思,这是我看别人问答里面有的,是什么属性忘了,这个有很大影响吗?
2017-02-07 回复 有任何疑惑可以回复我~
#2

慕粉0924044360 回复 辣椒加冰 提问者

这个我也不是很清楚,反正如果你加入了disc,就算是把ul改为li也没有反应,你试一下
2017-02-07 回复 有任何疑惑可以回复我~

>表示为子选择器,只能选择指定父元素的第一代子元素了,在这里,第一个UL为父元素,而父元素的第一代子元素里没有UL子元素,所以会没有反应,你将>号换成了空格,这个时候就变成了后代选择器,后代选择器可选择指定元素下的所有后代元素!

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

辣椒加冰 提问者

看了下一章之后清楚了,谢谢啦
2017-02-07 回复 有任何疑惑可以回复我~

  (空格):包含选择器      >:子选择器

>作用于元素的第一代后代,空格作用于元素的所有后代。

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

辣椒加冰 提问者

恩,就是这个道理,谢谢啦
2017-02-07 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么我把li改成了ul,就没有反应了,然后我把>换成了空格,才有了红框框,,不理解

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信