<div style="margin-bottom:50px;background-color:#f00;height:100px;"></div>
<div style="margin-top:80px;background-color:#00f;height:100px;"></div>
页面中,上div的下边距 margin-bottom 为50px. 下div的上边距 margin-top:80px.
实际显示只有80px,原因是下div的上边距包含了上div的下边距。
同理:如果上div的下边距为80px,下div的上边距为50px,那两个div之间的距离也为80px.
总结:出现两个div都设置了 margin的上下边距时,这两个div之间的距离不是累加而是取边距设置的比较大那一个。
上div与下div边距的包含关系
最新推荐文章于 2021-07-12 21:41:36 发布