父元素：box1,子元素：box2；
持续补充中。。。。。
1. flex布局
.box1{
width: 300px;
height: 300px;
border: 1px solid red;
display: flex;
align-items: center;
}
.box2{
width: 100px;
height: 100px;
border: 1px solid blue;
}
2. 定位+上下左右为0
.box1{
width: 300px;
height: 300px;
border: 1px solid red;
position: relative;
}
.box2{
width: 100px;
height: 100px;
border: 1px solid blue;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
3. 定位+平移translate
.box1{
width: 300px;
height: 300px;
border: 1px solid red;
position: relative;
}
.box2{
width: 100px;
height: 100px;
border: 1px solid blue;
position: absolute;
top: 50%;
transform: translate(0,-50%);
}
原文：https://www.cnblogs.com/zhangruiqi/p/14604721.html