W3C官方对于BFC的描述只有3小段,强烈建议想理解BFC的朋友先去看看,链接见文末。 常见的文档流分为:定位流、浮动流、普通流3种。BFC是普通流中的一种。 本文提出3个问题并给出使用BFC来解决这些问题的方法,这3个问题是: 外边距折叠(Collapsing Margins ...
目录 前言 Box: CSS布局的基本单位 amp 盒模型 盒模型 块级盒 行内盒 w c标准盒模型 块级盒 IE盒子模型 块级盒 行内盒 BOX 格式化上下文 什么是BFC Block formatting contexts w c规范定义: BFC的通俗理解: BFC布局规则: 那些元素生成BFC 元素与盒 正常流 块级与行内级 产生垂直外边距合并的必备条件 前言 什么是BFC 在解释 BF ...
2016-07-17 22:21 1 1418 推荐指数:
W3C官方对于BFC的描述只有3小段,强烈建议想理解BFC的朋友先去看看,链接见文末。 常见的文档流分为:定位流、浮动流、普通流3种。BFC是普通流中的一种。 本文提出3个问题并给出使用BFC来解决这些问题的方法,这3个问题是: 外边距折叠(Collapsing Margins ...
转文请标明 --- 出处:穆乙 http://www.cnblogs.com/pigtail/ 一、BFC是什么? BFC(Block Formatting Context)直译为“块级格式化范围”。 是 W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位 ...
最初这篇文章打算回答寒冬大神的第一问,谈谈CSS布局。本来呢我以为布局主要涉及float跟display相关属性,以及他们的包含框、静态位置等等。后来看了大神的一片面试文章,嗯?这里怎么还有个BFC,这是神马东东。待我搜索一下,萨萨萨,不看不知道,越看越糊涂,这到底是个神马东东。。。经过一个周 ...
什么是BFC? BFC 全称为 块级格式化上下文(Block Fromatting Context),是Web页面的可视化CSS渲染出的一部分。它是块级盒布局出现的区域,也是浮动层元素进行交互的区域。简单的来说,它就是一种会影响元素与元素之间的位置、间距的属性。 BFC 的特性 ...
1.什么是BFC 其实在老师让我们写这篇叫BFC的时候,我跟本不知道有什么BFC的东西。 后来,我找了一些资料,知道了,BFC是Block Formatting Context (块级格式化上下文)的缩写,它是W3C CSS 2.1 规范中的一个概念,是一个独立的渲染区域 ...
BFC就是页面上的一个隔离的独立容器,容器里面的子元素不会影响到外面的元素。反之也如此。包括浮动,和外边距合并等等,因此,有了这个特性,我们布局的时候就不会出现意外情况了。 display 属性为 block, list-item, table 的元素,会产生BFC. 给这些元素添加 ...
BFC 全称“块级格式化上下文”(Block Formatting Context),对应的还有 IFC。BFC 类似一个“结界”,如果一个 DOM 元素具有 BFC,那么它内部的子元素不会影响外面的元素;外面的元素也不会影响到其内部元素。 应用场景: 解决浮动子元素导致父元素,高度坍塌 ...
定义 在解释BFC之前,先说一下文档流。我们常说的文档流其实分为定位流、浮动流和普通流三种。而普通流其实就是指BFC中的FC。FC是formatting context的首字母缩写,直译过来是格式化上下文,它是页面中的一块渲染区域,有一套渲染规则,决定了其子元素如何布局,以及和其他元素之间 ...