3-4请检查
来源：3-4 编程练习
brown_one
2020-08-05 16:59:32
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<style type="text/css">
*{
margin:0;
padding:0;
}
.container{
width: 800px;
padding:20px;
margin: 0 auto;
border: 1px dashed #acacac;
overflow: hidden;
}
.pic1,.pic2,.pic3,.pic4,.pic5,.pic6{
border: 1px solid #acacac;
margin:10px;
float: left;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="container">
<div class="pic1">
<div><img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"></div>
<span>欢迎来到慕课网学习新知识！</span>
</div>
<div class="pic2">
<div><img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"></div>
<span>欢迎来到慕课网学习新知识！</span>
</div>
<div class="pic3">
<div><img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"></div>
<span>欢迎来到慕课网学习新知识！</span>
</div>
<div class="pic4">
<div><img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"></div>
<span>欢迎来到慕课网学习新知识！</span>
</div>
<div class="pic5">
<div><img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"></div>
<span>欢迎来到慕课网学习新知识！</span>
</div>
<div class="pic6">
<div><img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"></div>
<span>欢迎来到慕课网学习新知识！</span>
</div>
</div>
</body>
</html>
1回答
-
好帮手慕糖
2020-08-05
同学你好，盒子整体的宽度有些大了，内容没有填充满，导致右侧的空白多。一个图片单元的宽度是262px（包裹左右的外边距与边框），一行三个，262*3 = 786px，所以大盒子的宽度应该是786px。例：
如果我的回答帮助了你，欢迎采纳，祝学习愉快~
0
相似问题