BFC的触发条件以及现象？

1 overflow:hidden 、 auto 、 scroll visible ( 默认值 ) hidden ( 隐藏 ) auto ( 根

据内容自动出滚动条 ) scroll ( 强制出滚动条 )

2 根元素 html

3 float:left、 right

4 postion： absolute 、 fixed

5 display： inline ‐ block 、 table 、 table ‐ cell 、 table ‐ caption 、 flex 、 in

line ‐ flex

1 现象：

1 ）该盒子为一个独立容器，向上向下都不影响。

2 ）每一个容器都会独占一行。

3 ）父元素有定位 那么子元素的 margin 值只包含到父盒子右边框的距离。

4 ）触发 bfc 以后，上下两个盒子的 margin 的值会重叠（取最大值）

5 ）对于浮动元素，父盒子触发 bfc 后，则父盒子的高度会存在

6 ）浮动元素，若触发 bfc 后，那么该元素不会发生重叠。