css中的BFC
Posted lzhflzjx
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css中的BFC相关的知识,希望对你有一定的参考价值。
作用:
1.解决Margin塌陷
2.清除浮动
实现BFC:
1.根元素(整个页面就是一个大的BFC);
2.float为 left | right;
3.overflow为 hidden | auto | scroll;
4.display为 inline-block | table-cell | table-caption | flex | inline-flex;
5.position为 absolute | fixed;
参考地址 https://x-front-team.github.io/2017/02/19/CSS%E4%B8%AD%E7%9A%84BFC/
https://zhuanlan.zhihu.com/p/30168984
补充:不BFC解决margin塌陷
让两个边距不要相遇,中间可以使用父元素border或padding将边距分隔开
君不见,高堂明镜悲白发,朝如青丝暮成雪
以上是关于css中的BFC的主要内容,如果未能解决你的问题,请参考以下文章