一激率、水平居中
1.行內(nèi)元素居中（文字/圖片）
在父元素上加上text-align:center;
2.塊級元素居中
設(shè)置寬度，設(shè)置margin:0 auto;
二季蚂、垂直居中
1.行內(nèi)元素（塊級容器高度由內(nèi)容撐開）
上下padding相等
2.塊級元素（水平垂直居中）
{
position:absolute;
left:50%;
top:50;
transform: translate(-50%,-50%);
}
3.vertical-align （圖片在容器垂直居中）
vertical-align: middle可以使得行內(nèi)元素/表格在父容器內(nèi)中線對齊（可用于將同一行的不同大小的字體垂直居中）
垂直居中的辦法：
.box :before { content : ''; display : inline-block; height : 100%; vertical-align: middle; } .box : img { vertical-align: middle; }
- 使用table-cell
display : table-cell;
vertical-align: middle;
- 使用 display : flex
display : flex;
align-items : center; /* 垂直居中 */
justify-content : center; /* 水平居中 */
