1.定位
width：100px；
height：100px；
background-color：red；
1)
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
2)
position:absolute;
left:0;
top:0;
right:0;
botton:0;
margin:auto;
3)
position:absolute;
left:50%;
top:50%;
margin-top:-50px; ? //容器的一般高度
margin-left:-50px;
2display：table（table-cell
相對于它的父級元素垂直水平居中
）
.bigDiv{
width:200px;
height:200px;
display:table;
}
.small{
background-color:red；
display：table-cell；
vertical-align：middle；
text-align：center；
}
3.display：flex；(給父級設置display：flex；讓元素水平垂直居中)
（彈性布局）
.bigDiv{
width:200px;
height:200px;
display:flex;
justify-content:center;
align-items:center;
}
.smallDiv{
width:100px;
height:100px;
background-color:blue;
}
4.margin（外邊距）
.bigDiv{
width:200px;
height:200px;
background-color:red;
}
.smallDiv{
width:100px;
height:100px;
background-color:blue;
margin:50px auto;
}
