块级上下文(BFC)
来源:互联网 发布:百傲瑞达软件 编辑:程序博客网 时间:2024/05/16 06:30
块级上下文(BFC)
BFC(block formatting context)是W3C CSS2.1规范中的一个概念,他决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用。
Box是CSS布局中的对象和基本单位。元素的类型和display属性决定了Box的类型。盒子的类型有:
- block-level box(块级盒)
- inline-level box(行内盒)
- run-in box(CSS3提出)
BFC布局的规则
- 包含浮动元素。BFC区域不会与浮动元素重叠。
- 属于同一BFC的两个相邻Box的margin会发生重叠
- 浮动元素也参与BFC的计算
- BFC中子元素不影响外面的元素
触发BFC的几种方式
- 浮动元素,float 除 none 以外的值
- 绝对定位元素,position(absolute,fixed)
- display 为以下其中之一的值 inline-blocks,table-cells,table-captions
- overflow 除了 visible 以外的值(hidden,auto,scroll)
- 根元素
- display 的 table-caption 值(CSS3中增加)
BFC作用
- 清除内部浮动
- 防止垂直 margin 重叠
- 阻止元素被浮动元素覆盖
1 0
- 块级上下文(BFC)
- CSS BFC(块级格式化上下文)
- BFC(块级格式化上下文)
- BFC(块级格式化上下文)
- BFC(块级格式化上下文)
- BFC-块级格式化上下文
- BFC块级格式上下文
- 清除浮动及 BFC(块级格式化上下文)
- BFC块级格式化上下文简述
- CSS--BFC(块级格式化上下文)
- 深入BFC块级格式化上下文
- BFC(块格式化上下文)知识点整理
- (转)理解块级格式化上下文——BFC
- 理解CSS中的BFC(块级可视化上下文)[译]
- BFC环境(block formatting context块级格式化上下文)
- BFC(Block Formatting contexts): 块级格式上下文
- BFC(Block formatting context)直译为"块级格式化上下文"
- CSS朝花夕拾之块级格式上下文BFC
- Java中守护线程的总结
- 第一次,记录下这一伟大时刻~
- Linux ssh相关命令
- 对css语法的个人记忆
- 2016-年终总结
- 块级上下文(BFC)
- checkbox的全选和不全选
- Thrift原理简析
- Bugreport实战篇(二)
- sqlite的基本操作
- 博文转载
- qt creator常用快捷键
- 【学习笔记】提权
- 【java学习】synchronized和volatile详解