居中定位css

已知元素的宽度和高度：
.item {
position: absolute;
top: 50%;
left: 50%;
margin-top: -75px;
margin-left: -75px;
}
.item {
position: absolute;
margin:auto;
left:0;
top:0;
right:0;
bottom:0;
}

未知元素的高度和宽度：
.item {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%); / 使用css3的transform来实现 /
}
.parent {
display: flex;
justify-content:center;
align-items: center;
background: #AAA;
height: 300px; / 注意这里需要设置高度来查看垂直居中效果 /
}