我的li对齐方式无法跟作业要求一致,请问老师该怎么处理?

来源:4-7 编程练习

qq_鸭绿桥第一帅哥_0

2018-11-04 22:43:56

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

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

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>a</title>
        <style type="text/css">
          /*样式补充*/
          *{margin: 0px;padding: 0px;}
          .big{margin: 0 auto;width: 150px;background-color: #f2f4f6;border: 1px solid #ececec;text-align: center;}
          h3{font-size: 20px;font-family: "宋体";}
          li{font-size: 12px;font-family: "宋体";}
          .div1,.div2,.div3{border: 1px solid #d9dde1;}
          ul{background-color: white;list-style-type: none;line-height: 1em;}
          li{display: none;}
          h3:hover~ul li{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>


写回答

2回答

好帮手慕糖

2018-11-06

同学你好,很抱歉,修改的代码有一部分忘记粘贴了,如下;对你带来的不便请谅解,下次老师也会认真核对,把修改的代码全部粘贴哦。

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

祝学习愉快!

0

好帮手慕糖

2018-11-05

同学你好,这个是没有影响的哦,不过要想实现效果图中的位置,可以参考如下:

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

若能帮助到你,望采纳。

祝学习愉快!

0
hq_鸭绿桥第一帅哥_0
h 老师,还有一个问题。ul{width:102px;padding-left:60px;}102px和60px这两个数值怎么得来的?老师辛苦啦!
h018-11-06
共2条回复

0 学习 · 36712 问题

查看课程