对BFC的理解

原创 wangly 随笔 css布局 313阅读 2018-02-26 15:49:38 举报

一、概念:
BFC:块级格式上下文。
二、特性:
1、在同一个BFC中的元素互相影响,可能发生margin collapse。
2、BFC是页面上的一个隔离的独立容器,容器里的子元素不会影响外面元素的边距。
3、同级元素,浮动区域不会覆盖BFC区域。
4、计算BFC高度时,容器内的浮动元素也参与计算
三、创建BFC:
1、position:absolute|fixed
2、float:left|right
3、overflow:hidden|auto|scroll
4、display:inline-block|table-cell|table-caption|flex|inlne-flex
三、实例
1、高度坍塌和边距重叠问题

2、浮动区域不会覆盖BFC区域。
3、解决浮动,父元素高度塌陷
评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复