CSS之BFC
浏览数：25 /
时间：2015年06月09日
CSS之BFC
接触CSS一段时间之后，过了那段掌握基本知识的蜜月期之后开始痛苦于为什么排版老是出问题？？如何更好的排版呢？？针对这些问题，理解了BFC之后，会有一定的帮助的。
什么是BFC？BFC(block formamtting context中文翻译为块级格式化上下文)，BEC是个环境，这个环境对外表示为一个块，外界的元素对环境内的元素没有影响，相对，环境内的元素也不会受到外部环境的影响。
在CSS3中，BFC又被称为Flow Root。
BFC的形成条件：
1，设置了float;(float:none除外)，
2，overflow不为visible；(可以是hidden scroll auto等)
3，display的值为table-cell table-caption 或inline-bock；
4,position不为static和relative中的一个（relative设置后其原来的位置还是会被占用）
BFC的作用？了解了BFC的定义以及形成原理，如何使用呢？
1，包含浮动元素。在设置CSS样式的时候，有时会出现父元素高度塌陷，这是通常是由于子元素是浮动元素造成的，解决这种问题的方式就是给父元素一个BFC环境，通过以上几条合理的设置父元素的CSS样式。
2、不被浮动元素覆盖。
3. 阻止相邻元素的 margin 折叠。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
