代码正确么 还有家电列表里的洗衣机怎么样和其他家电首字对齐
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>display属性</title>
<style type="text/css">
/*样式补充*/
*{margin:0; padding:0;}
li{list-style:none;display:none;}
.div1,.div2,.div3{font-size:20px;background:#ececec;width:100px;text-align:center;border-top:1px solid #acacac;border-left:1px solid #acacac;border-right:1px solid #acacac;}
.div3{border-bottom:1px solid #acacac;}
ul{background:white;}
.div1:hover li{display:block;}
.div2:hover li{display:block;padding-left:20px;}
.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>
正在回答
同学你好，代码存在的问题如下：
1、整个内容在页面上没有水平居中显示。建议：为大盒子设置宽度，并且设置margin：0 auto；
具体修改如下：
2、“洗护”列表项中内容没有居中显示。将“洗护”列表中的边距去掉即可。
具体修改如下：
3、可以进行代码优化.
具体参考如下：
4、想要使列表项里的文字实现左对齐效果，首先将列表项的居中样式去掉，再为li和h3标题设置一个相同的左内边距即可实现。
具体参考如下：
另外，本题主要考察下拉列表的实现，同学设置的文本居中也是可以的
如果我的回答帮助了你，欢迎采纳。祝学习愉快~
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星