为什么我把li改成了ul，就没有反应了，然后我把>换成了空格，才有了红框框，，不理解
来源：8-6 捡了一个儿子 - 子选择器
辣椒加冰
2017-02-07 16:22
<!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回答
-
- 慕粉10560462
- 2017-02-07 16:37:12
因为你用子选择器这个大于号时，样式指定的是food类直属的元素，li是直属元素所以会改变，但这里面ul是从属于li之下的元素，直属于li，不是直属于food类，就不会在>命令下改变。而用空格则指定给了所有在这个类范围内的子标签，即使是间接的。所以ul这时会被改变。
其实欧洲封建制度跟>的方式很像，我的附庸的附庸不是我的附庸。。而中国集权制度跟空格的方式很像，我手下的手下都是我的手下
-
- 慕粉0924044360
- 2017-02-07 17:15:18
首先把 第六行把 ；disc 去掉就行了
其次 因为首个ul元素在body程序中不是food函数的子代元素，可以理解为并列元素，li才是，而除掉首个的ul元素才是子代元素，因此在你将>改为空格键后才会显示
-
- 慕粉1412448830
- 2017-02-07 16:42:08
>表示为子选择器，只能选择指定父元素的第一代子元素了，在这里，第一个UL为父元素，而父元素的第一代子元素里没有UL子元素，所以会没有反应，你将>号换成了空格，这个时候就变成了后代选择器，后代选择器可选择指定元素下的所有后代元素！
-
- 只是空穴何来风
- 2017-02-07 16:37:50
(空格)：包含选择器 >:子选择器
>作用于元素的第一代后代，空格作用于元素的所有后代。
初识HTML(5)+CSS(3)-升级版
HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义
1225806 学习 · 18234 问题
相似问题