css中bfc格式化

在 CSS 中，BFC（块级格式上下文）是一个非常重要的概念。BFC 是指 CSS 参考的一个独立的渲染区域，它内部的元素在布局时相互独立。BFC 可以理解为一类特殊的 CSS 渲染上下文，其中有很多属性对其影响都很大。

BFC 元素的一些特点包括：

1. BFC 元素总是从顶部开始布局，并且元素的边框以外不会存在浮动元素和与之重叠的元素。
2. BFC 元素内部的元素（例如浮动元素和标准流元素）会根据自己的方式在 BFC 内部排列。
3. BFC 元素的高度是包含浮动元素的高度，换句话说，BFC 元素会"撑起"包含它的区域，不会出现高度塌陷问题。
4. BFC 元素的区域不会与浮动元素的重叠，而是会环绕浮动元素。
5. BFC 元素的文本会围绕其容器边缘而不是浮动元素。

如何创建 BFC 呢？

1. float 属性：当元素使用 float 属性时，它会成为一个 BFC 元素。
2. position 属性：当元素使用 position 值为 absolute 或 fix 的时候，它会成为一个 BFC 元素。
3. display 属性：当元素的 display 属性值为 inline-block、table-cell、table-caption 时，它会成为一个 BFC 元素。
4. overflow 属性：当元素的 overflow 属性不为空的时候，它会成为一个 BFC 元素。

BFC 是前端开发中一个非常有用而且重要的技术。它可以避免一些奇怪的布局问题，比如浮动元素高度塌陷等等。我们应该熟练掌握创建 BFC 的方法，以便在实际开发中正确地应用 BFC。