1.两个或多个垂直元素,相邻边界会重合
1)边界都为(正或负)值,取绝对值最大的边界。
2)一个为负,一个为正,两者相加,如:(10+(-20)= -10)。
解决方案
用padding替代或给其中一个元素增加display:inline-block,添加inline-block的元素会覆盖住没有加inline-block的元素。
如果没有添加inline-block则默认下方的元素覆盖上方的元素
2、嵌套元素间相同方向的margin-top值子元素会传递给父元素,最终父元素的外边距的计算规则同相邻元素的计算规则一致。
解决方案:
用padding替代
给父元素添加overflow:hidden或者display:inline-block
给子元素添加display:inline-block
3、margin缩写
margin: 20px 30px 40px 50px 依次为上、右、下、左
margin: 20px 30px 40px 依次为上、(左右)下