麻烦老师检查下 看看哪里还需要改进
来源：3-4 编程练习
摇摆不定的风
2019-10-19 16:57:23
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<style type="text/css">
.sourse{
text-align: center;
margin: 0px;
padding: auto;
width: 820px;
border:1px #ccc dashed;
overflow: hidden;
zoom:1;
}
.div1,.div2,.div3,.div4,.div5,.div6{
margin: 15px;
border:1px #ccc solid;
width: 240px;
float: left;
}
img{
margin: 0px;
}
p{
margin: 2px;
font-size: 18px;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="sourse">
<div class="div1">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div class="div2">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div class="div3">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div class="div4">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div class="div5">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
<div class="div6">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"/>
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
</body>
</html>写回答
1回答
-
同学你好，从效果图中可以看出元素之间的距离是不相等的哦。
建议：因为类名为sourse的元素里面的div元素，设置了margin:15;为了元素之间的距离能够相等，可以给sourse元素添加padding属性，值为15px。并且宽度修改为内容的总宽度（一个div宽度为272px，一共三个div，总宽度为816px）
代码参考：
效果图：
祝学习愉快~
0
相似问题