当前位置: article > 正文

CSS-BFC 块级格式化上下文

作者：我家自动化 | 2024-04-16 15:09:09

踩

CSS-BFC 块级格式化上下文

BFC： Block formatting context 块级格式化上下文，可以看做是元素的一种属性，当元素拥有这一种属性之后，会形成独立的渲染区域，内部元素的渲染不会影响到外界

开启BFC的条件：

根元素（<html>）
浮动元素（float不为none)
绝对定位元素（元素的position为absolute 或 fixed)
display为inline-block、table-cell、table-caption、table、table-row、table-row-group、table-header-group、table-footer-group、inline-table、flow-root、flex或 inline-flex、grid 或inline-grid
overflow值不为visible的块元素
contain值为layout、content 或 paint的元素
多列容器（元素的column-count或 column-width 不为 auto，包括column-count为1）

BFC的作用：

声明：本文内容由网友自发贡献，转载请注明出处：【wpsshop】