请老师帮忙查看

请老师帮忙查看

请老师帮忙看下代码!还有家电下面那个洗衣机的”洗“字对齐方式,怎么弄成和上面的冰箱的”冰“还有空调的”空“字对齐呀?

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>display属性</title>

        <style type="text/css">

          /*样式补充*/

          *{margin:0px;padding:0px;}

          .big{background-color:#ececec;width:120px;margin:30px auto;text-align:center;}

           div{border:0.5px #0011 solid;line-height:2em;}

          h3{font-family:"宋体";}

          ul{background:white;}

          li{display:none;}

          .div1:hover li,.div2:hover li,.div3:hover 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回答

同学你好,不能哦,li设置margin:0 auto;是设置li整体居中,并不是里面的内容。

li是占满父级的宽度的,无法相对于父级实现水平居中。除非给li设置宽度等属性,不过这样比较繁琐,不建议这么设置哦。

祝学习愉快~

好帮手慕糖 2020-09-24 10:11:27

同学你好,回答如下:

1、li本身有自带的小圆点,可以去掉下。

2、另.big中设置了文字居中属性,也会对li这里的文字产生影响,导致居中,我们这里li的内容不需要居中。所以可以添加文字居左属性。

3、然后统一给li设置左内边距即可,整体的修改可以参考如下:

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

如果我的回答帮助了你,欢迎采纳,祝学习愉快~

  • 提问者 农民工扛把子 #1
    如果我把big中text-align属性去掉,将H2设置此属性,然后设置li的margin:0px auto,那么li这个块(非里面的文本)在父标签ul中会直接水平剧中吗?能达到同样效果吗?(因为我在上班,不方便自己测试,请老师帮忙解答,谢谢!)
    2020-09-24 11:00:27
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

0 星

相似问题

登录后可查看更多问答,登录/注册

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

在线咨询

领取优惠

免费试听

领取大纲

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