老師好,4-7 編程練習那裡需要改善?
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>display属性</title> <style type="text/css"> /*样式补充*/ *{ padding:0px;margin:0px; text-align:center; width:80px; } h3{ background:#DDDDDD; border:1px gray solid; } ul{display:none;} .div1:hover ul{display:inline;} .div2:hover ul{display:inline;} .div3:hover ul{display:inline;} li{ border-bottom:0px gray solid; text-align:center; border-left:1px gray solid; border-right:1px gray solid; background-color:white; } .div h2, .div h2{border-bottom:none;} </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>
0
收起
正在回答
1回答
同学你好,
1、最后一项列表底部没有边框显示:
可以将边框添加在ul上,如下:
2、移入div显示ul的样式可以进行合并,ul显示出来可以修改为block块元素,否则边框样式不对。参考:
可以重新测试下,祝学习愉快!
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星