BFC

1.面试题-双边距(边距重叠)

1.什么是边距重叠?
2.什么情况下会发生边距重叠?
3.如何解决边距重叠?
边距重叠:两个box如果都设置了边距,那么在垂直方向上,两个box的边距发生重叠,以绝对值大的那个为最终结束显示在页面上。

BFC意为”块级格式化上下文”

2.什么时候会触发BFC呢?

常见的如下:
1.overflow: auto/ hidden;
2.position: absolute/ fixed;
3.float: left/ right;b
4.display: inline-block/ table-cell/ table-caption/ flex/ inline-flex

BFC的原理?(面试可不说,但要理解)

1.BFC内部的盒子,会在垂直方向,一个接一个地放置。垂直方向上也会发生边距重叠。
2.BFC就是页面上的一个独立容器,容器里面的子元素不会影响到外面的元素,外边的也不会影响里边的。
3.BFC的区域不会与float重叠。
4.计算BFC的高度时,浮动元素也被计算在内。

原文地址:https://www.cnblogs.com/luckyjiu9/p/13845630.html