在标准文档流中（在浮动下margin在竖直方向就没有塌陷现象了），margin在竖直方向有(margin在水平方向没有)塌陷现象。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{
padding: 0;
margin: 0;
}
.pp1{
width: 200px;
height:200px;
background-color:red;
margin-bottom:20px; /*50px>20px,所以他们的间距是50px*/
}
.pp2{
width: 200px;
height:200px;
background-color:green;
margin-top:50px; /*50px>20px,所以他们的间距是50px*/
}
</style>
</head>
<body>
<div>
<p class="pp1">pp1</p>
<p class="pp2">pp2</p>
</div>
</body>
</html>
扫一扫
2879
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
