这样对吗?还有我设置的背景颜色是灰色,下边框为灰色的时候为什么不显示,只能改成黑色的?

来源:4-7 编程练习

为你浅笑

2019-05-07 00:33:45

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>display属性</title>

        <style type="text/css">

          /*样式补充*/

          body,div,ul{margin:0px;padding:0px;}

          .big{

            border:1px solid black;

            width:200px;

            margin:0px auto;

            text-align:center;

            background:gray;

          }

          .div1,.div2{

             border-bottom:1px solid black; 

          }

          ul{

            display:none;

            background:white;

            list-style-type:none;

          }

          h3:hover+.elec{display:block;}

          h3:hover+.wash{display:block;}

          h3: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回答

好帮手慕码

2019-05-07

同学你好!

效果实现的是可以的~

下边框设置灰色是生效的,只是背景颜色也是灰色,混在一起就不太明显了

http://img.mukewang.com/climg/5cd0fed0000169d304800096.jpg

http://img.mukewang.com/climg/5cd0fedd000131a104010093.jpg

如果帮助到了你 欢迎采纳 祝学习愉快~

0

0 学习 · 40143 问题

查看课程