4-7编程练习。

首页课程实战体系课手记专栏慕课教程

4-7编程练习。

来源：4-7 编程练习

JovetWang

2018-06-16 16:28:56

4-7的编程练习我这样写有问题吗

我看其他人的代码有设置字体边框什么的

但是我没看出来实际的显示效果有什么区别

请大神指教一下谢谢

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>display属性</title>
        <style type="text/css">
          /*样式补充*/
        *{margin:0px;padding:0px;}
        .big{width:130px;
            background-color:lightgray;
            margin:0 auto;
            padding:0px;
            text-align:center;}
        ul{list-style:none;
           display:none;}
        .div1:hover ul{display:block;
            background-color:white;}
        .div2:hover ul{display:block;
            background-color:white;}
        .div3:hover ul{display:block;
            background-color:white;}
        </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回答