BFC原则

BFC：块级格式化上下文，是web页面渲染css的时候渲染的一部分。

形成了bfc就形成了一个独立的区域，区域里面的子元素不会影响到外面的元素

一、 形成BFC的方法：

• 浮动元素：元素的float属性不是none的元素
• 绝对定位的元素：position的值为absolute或fixed
• 内联块状元素：display:inline-block;
• 具有overflow并且只不是visible的块元素

二、利用BFC:

overflow:hidden/display:flow-root

• 解决float高度塌陷

• 解决父子之间的margin合并

   子元素`overflow:hidden`无效
  

• 解决文字环绕问题,二级菜单（文字始终不超过图片、标题

三、二级菜单：标题自适应

<li>
     <h5>嘻嘻</h5>
     <p>
     <a href="">呵呵</a>
     </p>
</li>

 h5 {  float: left  }
 p  {  display: flow-root  }