外边距导致的合并问题:
1 处于一上一下位置的两个块级元素 在同时各自设置了上下边距时,二者间的外边距通常以 数值较大的一个作为两者间的外边距 而不是简单的数值相加
.box2{ width: 100px; height: 100px; background: deepskyblue; margin-top: 50px; } .box1{ width: 100px; height: 100px; background: red; margin-bottom: 100px; }
解决方案是: 给其中一个盒子再套一个div 并给这个div 设置overflow:hidden (开启BFC机制)
container{ overflow: hidden; }
`