老师我的鼠标经过怎么没有效果呢,哪里出问题了我那个掌握不牢固

老师我的鼠标经过怎么没有效果呢,哪里出问题了我那个掌握不牢固

<!DOCTYPE html>
<html><head>
    <meta charset="UTF-8">
    <title>display属性</title>
    <style type="text/css">
    div {
        width: 200px;
    }
    /*补充样式*/
    li{
        display:none;
    }
       div:hover ul{
        display:block;
    }
    </style>
</head><body>
    <div>
        <h2>家电</h2>
        <ul>
            <li>冰箱</li>
            <li>空调</li>
            <li>洗衣机</li>
        </ul>
    </div>
</body></html>

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

4回答
夏一同学 2019-12-21 19:36:25

详细解答如图:

http://img1.sycdn.imooc.com//climg/5dfe039f09f5d01410080776.jpg

qq_圆方_0 2019-12-12 21:17:44

div:hover ul{
        display:block;}

你把样式表中的 ul 改为 li 就可以了

好帮手慕糖 2019-12-11 17:24:44

同学你好,是指h2:hover li{display: block;这样吗?

这个就表示,h2元素下的li元素,然后设置样式;但是h2与li不是父级元素(或者祖先关系)。直接写的话,是没有效果的。

所以应该将hover设置给外面大盒子div,移入div的时候显示li。

另,建议:可以新建问题进行提问,便于复习时进行查找。

祝学习愉快~


好帮手慕糖 2019-12-08 09:59:27

同学你好,这是因为设置的是li隐藏,但是显示却是设置给ul的,这里应该给li设置显示。

另,li要在一行显示,建议:可以设置为行内块显示,例:

http://img1.sycdn.imooc.com//climg/5dec58a909215f3a04110300.jpg

如果我的回答帮助了你,欢迎采纳,祝学习愉快~

  • 为什么是div:hover? 而不是h2:hover?
    2019-12-11 15:40:39
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师