所有浏览器显示效果都一样 给父级加上border属性，除IE6/7以外都可正常显示,可以通过overflow和zoom触发BFC和layout属性解决 ...
分类：
其他好文 时间：
2017-05-12 17:31:16
阅读次数：
195
BFC(Block formatting context) 直译为"块级格式化上下文"。 BFC它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。 白话文： 孩子在家里愿意怎么折腾都行，但是出了家门口， ...
分类：
其他好文 时间：
2017-05-10 14:45:07
阅读次数：
207
BFC（Block Formatting Context，块格式上下文） 具有BFC特性的元素能够看作是隔离了的独立容器，容器里面的元素不会在布局上影响到外面的元素。 在CSS3中。BFC叫做Flow Root。 在CSS2.1中。有三种定位方案——普通流（Normal Flow），浮动（Float ...
分类：
Web程序 时间：
2017-04-29 10:54:25
阅读次数：
174
块级格式化上下文：在父级建bfc，子级浮动导致高度塌陷可以找回高度 overfolw：hidden 常见会触发bfc的：1.根元素 2.folat 3. overolw:auto scroll ,hidden4.display:table-cell, table-caption inline-blo ...
分类：
Web程序 时间：
2017-04-24 01:02:16
阅读次数：
237
最开始学前端就听过“外边距折叠”这一专业名词，可是什么条件下会发生外边距折叠，后来有了说法，叫“只有处于同一个BFC的外边距会发生折叠（什么是BFC不在这节做讨论）”，那是不是只有这一种条件下外边距才不折叠呢？ 研究css2.2中的box model关于Collapsing margins的讲解。 ...
分类：
其他好文 时间：
2017-04-10 19:40:03
阅读次数：
179
初学CSS时，我们学到很多有意思的CSS规则，比如外边距塌陷，还有浮动元素的一些特性等，其实这些规则背后都是BFC这个东西在控制，下面我们来看下BFC到底是什么。什么是BFCBFC（Blockformattingcontexts），翻译过来就是块级格式化上下文，指的是一种上下文环境，我们暂且不管它..
分类：
其他好文 时间：
2017-04-08 23:07:41
阅读次数：
227
利用bfc： 补充一下：BFC翻译过来是块级格式化上下文，和haslayout比较相似，但haslayout是旧版本IE下的一个专有属性，表示元素自己对自身的内容进行组织和计算。BFC相当于一个独立的渲染单元，内外元素不会相互影响。我这里overflow:hidden触发BFC，利用的是BFC布局的 ...
分类：
Web程序 时间：
2017-03-31 19:55:58
阅读次数：
213
如何触发BFC呢？ float 除了none以外的值 overflow 除了visible 以外的值（hidden，auto，scroll ） display (table-cell，table-caption，inline-block) position（absolute，fixed） field ...
分类：
其他好文 时间：
2017-03-24 20:31:44
阅读次数：
165
一、BFC 定义 BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。 二、BFC布局规则：1、BFC布局规则：（1） ...
分类：
其他好文 时间：
2017-03-12 23:50:59
阅读次数：
760
BFC 已经是一个耳听熟闻的词语了，网上有许多关于 BFC 的文章，介绍了如何触发 BFC 以及 BFC 的一些用处（如清浮动，防止 margin 重叠等）。虽然我知道如何利用 BFC 解决这些问题，但当别人问我 BFC 是什么，我还是不能很有底气地解释清楚。于是这两天仔细阅读了CSS2.1 spe ...
分类：
其他好文 时间：
2017-03-06 19:41:30
阅读次数：
242
