CSS之BFC(Block Formatting Context)

这是我的第一篇博客，不知道从什么开始写起，那就从我现在看的开始写起吧。
以前我也不知道BFC是什么，今天看了才知道原来以前经常接触，只是不知道专业名称罢了。就像闭包、继承一样，以前经常用到，只是不知道而已，今天我就来说一下，css定位之BFC.
BFC与清除浮动是有关系的，那我们就来说说，如何清除浮动，清除浮动主要有两种方法：
①利用 clear属性，清除浮动
②使父容器形成BFC
在讲BCF之前，我要先说一下，我们通常控制元素布局的定位方案主要有3种：普通流 （Normal Flow） 、浮动 （Floats） 和绝对定位 （Absolute Positioning） 
***普通流（Normal Flow）
在普通流中，元素按照其在 HTML 中的先后位置至上而下布局，在这个过程中，行内元素水平排列，直到当行被占满然后换行，块级元素则会被渲染为完整的一个新行， 除非另外指定，否则所有元素默认都是普通流定位，也可以说，普通流中元素的位置由该元素在 HTML 文档中的位置决定。
***浮动 （Floats）
在浮动布局中，元素首先按照普通流的位置出现，然后根据浮动的方向尽可能的向左边或右边偏移。
***绝对定位 （Absolute Positioning）
在绝对定位布局中，元素会整体脱离普通流，因此绝对定位元素不会对其兄弟元素造成影响（而浮动素会影响兄弟元素），而元素具体的位置由绝对定位的坐标决定。
BFC 正是属于普通流的，因此它对兄弟元素也不会造成什么影响。
&&--BFC的定义--&&
在进行盒子元素布局的时候， BFC 提供了一个环境， 在这个环境中按照一定规则进行布局不会影响到其它环境中的布局。比如浮动元素会形成 BFC,浮动元素内部子元素的主要受该浮动元素影响，两个浮动元素之间是互不影响的。也就是说，如果一个元素符合了成为 BFC 的条件，该元素内部元素的布局和定位就和外部元素互不影响（除非内部的盒子建立了新的 BFC）， 是一个隔离了的独立容器。
&&--BFC到底是什么--&&
当涉及到可视化布局的时候，Block Formatting Context提供了一个环境，HTML元素在这个环境中按照一定规则进行布局。一个环境中的元素不会影响到其它环境中的布局。比如浮动元素会形成BFC,浮动元素内部子元素的主要受该浮动元素影响，两个浮动元素之间是互不影响的。这里有点类似一个BFC就是一个独立的行政单位的意思。
&&--怎样才能形成BFC--&&
①float的值不为none.
②overflow的值不为visible.
③display的值为table-cell, table-caption, inline-block中的任何一个。
④position的值不为relative和static.
⑤css3中flex boxes
&&--BFC的作用--&&
①包含浮动元素（清除浮动）
BFC 会 根据子元素的情况自 适应 高度 ,这个 特性 是 对父元素 使 用overflow:hidden/auto/scroll、 float:left/right 样式可以闭合浮动的
②不被浮动元素覆盖

浮动元素会无视兄弟元素的存在， 覆盖在兄弟元素的上面， 为该兄弟元素创建BFC 后可以阻止这种情况的出现.

<div id="navigator">

<ul id="navList">
<li><a id="blog_nav_sitehome" class="menu" href="www.changtu.com/chepiao/baodingshi-hangzhoushi.html">保定到杭州的汽车</a></li>