其他分享
首页 > 其他分享> > 一分钟带你了解BFC

一分钟带你了解BFC

作者:互联网

BFC是什么

     格式化上下文 ,他是文档中的一块渲染区域,他有一套自己的渲染规则,他决定了子元素如何定位,以及和其他元素的关系和相互作用

如何触发BFC

1.根元素(<html>)

2.浮动定位(元素的float不是none)

3.绝对定位(元素的position为absolute或者fixed)

4.行内块元素(元素的display为inline-block)

5.表格单元格(元素的display为table-cell,HTML表单单元格默认为该值)

6.overflow不等于visible

7了解更多参考https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Block_formatting_context

BFC的特性

1.同一个BFC,上下外边距会重合(也就是外边距塌陷)

2.清除浮动(BFC可以包含浮动元素)

3.BFC区域不会和float元素重叠

标签:BFC,浮动,float,元素,一分钟,了解,display,单元格
来源: https://blog.csdn.net/clc_bk/article/details/121763437