bfc（block formatting context，块格式上下文）
具有BFC特性的元素可以看作是隔离了的独立容器，容器里面的元素不会在布局上影响到外面的元素。
在CSS3中，BFC叫做Flow Root。
在CSS2.1中，有三种定位方案??普通流（Normal Flow），浮动（Float）和绝对定位（Absolute Positioning）。
立即学习“前端免费学习笔记（深入）”；
（1）如何触发BFC？
下列情况将创建一个BFC环境：
（a）浮动（元素的float非none）
（b）绝对定位元素（元素的position为absolute或fixed）
（c）display为inline-block, table-cell, table-caption, flex, inline-flex
（d）overflow非visible（为hidden，auto，scroll）
立即学习“前端免费学习笔记（深入）”；
（2）BFC有什么特性？
（a）BFC会阻止竖直margin的折叠
如果两个块级元素相邻且在同一个BFC环境时，它们竖直方向之间的margin（margin-bottom与margin-top）会发生折叠（塌陷）。而如果它们不在同一个BFC下，则不会折叠。
（b）BFC可以”包容“浮动元素
BFC会根据子元素的情况自动调整高度，即使其子元素中包含浮动元素
（c）BFC可以阻止元素被浮动元素覆盖
立即学习“前端免费学习笔记（深入）”；
立即学习“前端免费学习笔记（深入）”；
版权声明：本文为博主原创文章，未经博主允许不得转载。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/3102979.html
