BFC的概念
Posted chenshihao
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了BFC的概念相关的知识,希望对你有一定的参考价值。
哪些元素会生成BFC
- 根元素html
- float属性不为none
- position为absolute / fixed
- display为inline-block table-cell, table-caption, flex , inline-flex
- overflow不为visible
BFC的布局规则 或者BFC 展现出的特性
- 内部的box会在垂直方向,一个接一个地放置
- box垂直方向的距离由margin决定, 属于同一个BFC的二个相邻box的margin 会发生重叠
- 每个元素的margin box的左边,与包含块border box的左边相接触。即使存在浮动也是如此
- BFC的区域不会与float box 重叠
- BFC就是页面上的一个隔离的独立容器, 容器里面的子元素不会影响到外面的元素
- 计算BFC的高度时,浮动元素也参与计算。
以上是关于BFC的概念的主要内容,如果未能解决你的问题,请参考以下文章