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

为什么所有都红色,不应该第一代“水果蔬菜”是红色吗?

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>后代选择器</title>
<style type="text/css">
.first span{color:red;}

.food>li{
    color:red;
    border:1px solid red;/*添加边框样式(粗细为1px, 颜色为红色的实线)*/	
}
</style>
</head>
<body>
 <p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<!--下面是本小节任务代码-->
<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>

http://img1.sycdn.imooc.com//577a58c900018a8604720318.jpg

正在回答

6 回答

这里的颜色样式具有继承性,即food类标签里面的所有标签如果没有集体设置,根据权限是为red的,而边框刚好是没有继承性的,所有food里面的标签是没有继承到,只在第一子后代发挥作用,你可以看看第9章的第一部分的继承这块。

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

如歌褪变 提问者

非常感谢!
2016-07-04 回复 有任何疑惑可以回复我~

你把第十行color:red  删去就好了

你这字体肯定都变红色了

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

你把这句去了看看效果

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

.font>li指的是把ul中扩展的第一层li的变成红色,你看第二层li香蕉就没有边框。而且颜色指的是li中的<li></li>中的字体。就包括所有的字了。

0 回复 有任何疑惑可以回复我~
.font>li等于把ul里面所有的li都定义了,肯定都变成红色啊


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

土豆土豆potato

那为什么border:1px solid red; 这个不会把li里面的都框起来?
2016-07-04 回复 有任何疑惑可以回复我~
#2

如歌褪变 提问者

子选择器用于指定元素的第一个后代,而“香蕉、苹果、梨、白菜、油菜、卷心菜”是第二个后代,按你说的,“香蕉、苹果、梨、白菜、油菜、卷心菜”页应该有红色边框啊
2016-07-04 回复 有任何疑惑可以回复我~
对一个块应用了,就会默认对里面所有元素都应用了,除非你特别注明不应用才不会应用。
2 回复 有任何疑惑可以回复我~
#1

如歌褪变 提问者

子选择器用于指定元素的第一个后代,而“香蕉、苹果、梨、白菜、油菜、卷心菜”是第二个后代,按你说的,“香蕉、苹果、梨、白菜、油菜、卷心菜”页应该有红色边框啊
2016-07-04 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么所有都红色,不应该第一代“水果蔬菜”是红色吗?

我要回答 关注问题
微信客服

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

帮助反馈 APP下载

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

公众号

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