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

不是应该是第一个是只显示水果和蔬菜是红色,第二个是全部都是红色吗,为什么运行是两个输出都是红色的

<style type="text/css">

.food>li{

    color:red;

}

</style>

<ul class="food">

    <li>水果

        <ul>

        <li>香蕉</li>

         <li>苹果</li>

          <li>梨</li>

        </ul>

    </li>


    <li>蔬菜

        <ul>

        <li>白菜</li>

         <li>油菜</li>

          <li>卷心菜</li>

        </ul>

    </li>

</ul>

和下面这个为什么运行时一样的结果的

<style type="text/css">

.food  li{

    color:red;

}

</style>

<ul class="food">

    <li>水果

        <ul>

        <li>香蕉</li>

         <li>苹果</li>

          <li>梨</li>

        </ul>

    </li>


    <li>蔬菜

        <ul>

        <li>白菜</li>

         <li>油菜</li>

          <li>卷心菜</li>

        </ul>

    </li>

</ul>


正在回答

4 回答

"以color-  font-  text-  line-  开头的,这些关于文字样式的,都能够继承;所有关于盒子的,定位的,布局的属性都不能继承。"

另外,具体可继承的属性为:letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction、text-indent、text-align、list-style、list-style-type、list-style-position、list-style-image。
具体不可继承的属性为:display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、page-bread-before等; 

继承性是从大贯穿到最小的,从自己开始的,直到最小的元素。即继承性不光儿子可以继承,只要是后代都可以继承

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

你发的两段代码区别在哪?

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

元素具有继承性

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

举报

0/150
提交
取消

不是应该是第一个是只显示水果和蔬菜是红色,第二个是全部都是红色吗,为什么运行是两个输出都是红色的

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