BFC的触发条件
根元素(html)float属性不为none
position为absolute或fixed
display为inline-block, table-cell, table-caption, flex, inline-flex
overflow不为visible
清除浮动的方法有哪些
1、 overflow:hidden;(触发一个BFC)
缺点：只要里面的内容超出父元素就会隐藏
2、 在浮动元素下方添加一个空元素div，并设置属性
div{clear:both; height:0; overflow:hidden;}
缺点：会添加很多空标记，增加结构负担，产生代码冗余
3、 万能清除法
:after{content:“";clear:both;display:block;height:0;overflow:hidden;visibility:hidden;}
缺点：单词多
给父元素加display:table;让父元素转换元素类型和表格一样
缺点：改变当前元素类型
设置一个元素con(未知大小)在box里面水平垂直居中的方法
第一种：定位
.box{position:relative;}
.con{ position:absolute;top:0;left:0:bottom:0;right:0;margin:auto;}
第二种：
.box{display:flex;justify-content:center;align-items:center;}
第三种：
.div{position:relative;}
.con{position:absolute;left:50%;top:50%;translateX(-50%)translateY(-50%)}
常见的浏览器内核
Trident代表作：IE
Gecko 代表作：Mozilla
WebKit 代表作：苹果 & 谷歌旧版本
Blink 代表作：谷歌 & 欧鹏
