文本垂直居中
单行文本：line-height的值等于height；
多行文本：padding上下值一致即可；
还可以使用position：absolute进行绝对定位，如果是相对父级元素，则需要设置position:relative。
top:50%;
left:50%;
margin-left:元素宽度/2;
margin-top:元素高度/2;
水平居中-行内元素
.父元素{text-align: center;}
水平居中-定宽块状元素
.块状元素{margin:0 auto;}
水平居中-不定宽块状元素
方法一：元素外面添加<table>标签（包括<tr><td>），对<table>设置"margin：0 auto;"
方法二：块状元素设置成"display:inline"或者"display:inline-block"，再对其父元素设置"text-align: center;"
方法三：
.父元素{
float: left;
position: relative;
left: 50%;
}
.子元素{
position: relative;
left: -50%;
}
垂直居中-父元素高度确定的单行文本
line-hight 和 hight 高度一致
垂直居中-父元素高度确定的多行文本
方法一：元素外面添加<table>标签，同时设置"vercial-align:middle;"
方法二：块状元素设置"display: table-cell"，同时设置"varcial-align: middle;" 兼容性：IE8+
解决行内元素间隙bug
父元素使用 font-size:0;
清除浮动的三种方法
1.添加新元素
.clear{clear: both; height: 0; line-height: 0; font-size: 0}
2.父元素添加overflow
.over-flow{overflow: auto; zoom: 1; /* zoom: 1; 是在处理兼容性问题 */}
3.父元素添加伪类:after
.outer :after {clear: both; content:'.'; display: block; width: 0; height: 0; visibility: hidden;}