4-5编程题很别扭麻烦帮我看看哪里出问题

来源：4-7 编程练习

k1ans

2017-07-31 11:01:10

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>display属性</title>
        <style type="text/css">
          /*样式补充*/
          body,div,ul,li,h3{margin:0; padding:0;}
          h3{width:130px;height:25px;background-color:#ddd;margin:auto;border:1px solid #aaa;text-align:center;padding-top:5px;}
          ul{border:1px solid #aaa;width:130px;height:100px;list-style-type:none;margin:0px auto;}
          li{margin:15px;text-align:center;}
         .elec{display:none;}
         .wash{display:none;}
         .clothes{display:none;}
         .big:hover .elec{display:inline;}
         .div2:hover .wash{display:inline;}
         .div3:hover .clothes{display:inline;}
        </style>
    </head>
    <body>
    <div class="big">
        <div class="div1">
            <h3>家电</h3>
            <ul class="elec">
                <li>冰箱</li>
                <li>洗衣机</li>
                <li>空调</li>
            </ul>
        </div>
        <div class="div2">
            <h3>洗护</h3>
            <ul class="wash">
                <li>洗衣液</li>
                <li>消毒液</li>
                <li>柔顺剂</li>
            </ul>
        </div>
        <div class="div3">
            <h3>衣物</h3>
             <ul class="clothes">
                <li>衬衫</li>
                <li>裤子</li>
                <li>卫衣</li>
            </ul>
        </div>
      </div>
</body>
</html>

写回答

1回答

好帮手慕糖

2017-07-31

你好，以下几点需要修改：

（1）建议设置.big的宽度，因为div1-div3没有设置宽度，会导致继承父级的100%，移出事件时左右移出会有影响。修改代码参考以下：

.big{
    width: 130px;
    margin:auto;
}

（2）建议把display:inline;改为display:block;

（3）第一个hover事件，应该是div1,你写的是big元素的，请认真检查。

（4）建议去掉ul中的高度，让它的高度自适应。

祝学习愉快！

h1ans

h 我再做整改谢谢您的建议

h017-07-31

共1条回复

0 学习 · 36712 问题

查看课程

相似问题

老师帮忙看看这两处问题该怎么办

回答 3

4-5 有什么问题。好麻烦。

回答 1

4-5编程练习，麻烦老师帮忙检查

回答 4

4-5编程问题

回答 2

4-5编程练习，问题请看代码中的注释

回答 7

打开慕课网App查看更多内容