老師是否正確?
来源：3-4 编程练习
慕数据3203843
2019-08-31 15:09:59
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<style type="text/css">
*{
padding:0;
margin:0;
}
.content{
width:800px;
border:2px gray dotted;
overflow:hidden;
}
.content li
{
width:240px;
height:170px;
margin:2px;
border:2px gray solid;
list-style:none;
margin:10px;
}
.content .book li{
float:left;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="content">
<div>
<ul class="book">
<li><img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">歡迎來到慕課網學習新知識!</li>
</ul>
<ul class="book">
<li><img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg">歡迎來到慕課網學習新知識!</li>
</ul>
<ul class="book">
<li><img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">歡迎來到慕課網學習新知識!</li>
<ul class="book">
<li><img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">歡迎來到慕課網學習新知識!</li>
</ul>
<ul class="book">
<li><img src=http://climg.mukewang.com/590fe97d00011bda02400135.jpg>歡迎來到慕課網學習新知識!</li>
</ul>
<ul class="book">
<li><img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">歡迎來到慕課網學習新知識!</li>
</ul>
</div>
</div>
</body>
</html>写回答
1回答
-
同学你好，测试同学的代码测试，从图中可以看出距离是不一致的。
建议：调整.content元素的宽度和内边距（元素设置了margin:10;那么可以给content元素加padding:10px）
页面效果：
另外 同学的布局上有些不合理。
建议：ul里面设置6个li元素，设置浮动，调整间距就可以了。
如果帮助到了你，欢迎采纳~祝学习愉快~
0
相似问题