请问代码是否规范。

请问代码是否规范。

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>display属性</title>

        <style type="text/css">

         div,h3,ul,li{margin: 0;padding: 0;list-style: none;}

         h3{font-size: 40px;height: 45px;font-family: "宋体"; font-weight:bold;background-color: #BBBBBB;}

         ul{font-size: 20px;font-family: "宋体";text-align: left;margin-left: 60px;}

         .big{width: 200px;text-align:center;;margin:0 auto; }

         .div1{border:1px solid #BBBBBB;}

.div2{border:1px solid #BBBBBB;}

.div3{border:1px solid #BBBBBB;}

         .elec{display: none;}

         .wash{display: none;}

         .clothes{display: none;}

         /*.big div:hover ul{display: none;}*/

          .div1:hover .elec{display: block;}

          .div2:hover .wash{display: block;}

            .div3:hover .clothes{display: block;}  

        </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回答

同学你好, 代码规范, 效果实现的不错。

不过可以优化一下代码, 让鼠标移入到big下的div上,让对应的ul显示出来, 简化代码的书写量哦

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

如果帮助到了你, 欢迎采纳!

祝学习愉快~~~

问题已解决,确定采纳
还有疑问,暂不采纳

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

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

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

在线咨询

领取优惠

免费试听

领取大纲

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