前端面试题HTML+CSS基础篇——双边距重叠

414 阅读1分钟

双边距重叠问题

  1. 什么是双边距重叠

多个相邻的(兄弟或者父子关系)标准流中的块元素垂直方向的margin会重叠。

  1. 折叠结果

两个相邻的外边距都是正数的时候,折叠结果就是它们两者之间较大的值

两个相邻的外边距都是负数的时候,折叠结果就是它们两者之间绝对值的较大值

两个相邻的外边距一正一负的时候,折叠结果就是它们两者相加的和

  1. 如何解决双边距重叠

给其中的一个div添加一个父的div,并且为这个div设置边框或者实现overflow:hidden;

将块级div设置成行内div(display:inline-block;)