下边距问题
来源:5-4 编程练习
慕慕9452826
2018-11-22 22:42:51
这个行与行之间有分裂开,怎样合并起来

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
/*此处写代码*/
html,body{
margin: 0;
}
#h1 {
background-color: lightblue;
height: 260px;
width: 90%;
margin: 70px;/*边距*/
}
#h2{
background-color: pink;/*背景*/
height: 120px;
width: 90%;
margin: 70px;
}
.img1,.img2{
float: left;/*向左浮动*/
margin-left: 160px;/*左边距*/
margin-top: 23px;/*上部边距*/
}
.img3,.img4,.img5{
float: left;/*向左浮动*/
margin-left: 150px;
margin-top: 30px;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div id="ym">
<div id="h1">
<img src="http://climg.mukewang.com/58c0f808000129a303600215.jpg" alt="" class="img1">
<img src="http://climg.mukewang.com/58c0f819000198a703600214.jpg" alt="" class="img2">
</div>
<div id="h2">
<img src="http://climg.mukewang.com/58c0f81d0001fe4402000060.jpg" alt="" class="img3">
<img src="http://climg.mukewang.com/58c0f8220001dfce02000060.jpg" alt=""class="img4">
<img src="http://climg.mukewang.com/58c0f8780001c74602000060.jpg" alt="" class="img5">
</div>
</div>
</body>
</html>
1回答
好帮手慕查理
2018-11-23
您好,由于#h1和#h2中的margin:70px;造成的。由于margin设置的是四个边的外边距,那么也就是包括上下边距的。因此在设置之后,上半部分底部添加70px,下半部分上边添加70px,也就出现了间隙。将margin设置去除即可。祝学习愉快!
相似问题