css中的bfc是什么？如何会触发

BFC 是块级格式化上下文（Block Formatting Context）的缩写，是 CSS 布局中的一个概念。BFC 是一个独立的渲染区域，决定了其内部块级元素如何布局和相互影响。

BFC 可以通过以下方式触发：

1. 根元素（html）或包含它的元素。
2. 浮动元素（float 属性不为 none）。
3. 绝对定位元素（position 属性为 absolute 或 fixed）。
4. 行内块元素（display 属性为 inline-block）。
5. 表格单元格（display 属性为 table-cell）。
6. 表格标题（display 属性为 table-caption）。
7. 匿名表格单元格元素（display 属性为 table、table-row、table-row-group、table-header-group、table-footer-group 之一）。
8. overflow 属性值不为 visible 的元素（overflow 为 auto、scroll 或 hidden）。
9. 弹性盒子容器（display 属性为 flex 或 inline-flex）。
10. 网格容器（display 属性为 grid 或 inline-grid）。

当一个元素创建了BFC后，会产生一些影响，例如：

• BFC中的元素垂直排列，一个块级元素紧跟在另一个块级元素的下方。

• BFC中的浮动元素会被包含在BFC中，不会影响到外部元素的布局。

• BFC中的元素不会与浮动元素重叠。

• BFC提供了一种清除浮动的方法，可以防止父元素坍塌。

当一个元素触发 BFC 后，它会按照 BFC 的规则来进行布局，与其他元素相互影响时会有特定的行为，例如阻止浮动元素重叠、清除浮动、自适应父元素等。