position有三种:
1.父元素:position:absolute/relative/fixed;
子元素:{
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
margin:auto;
}
2.父元素:position:absolute/relative/fixed;
子元素:{
width:100px;
height:100px;
position:absolute;
top:50%;
left:50%;
margin:-50px 0 0 -50px;
}
3.2.父元素:position:absolute/relative/fixed;
子元素:{
width:100px;
height:100px;
position:absolute;
top:50%;
left:50%;
transform:translate(-50px,-50px);
}
display:flex;有两种
1.父元素:{
display:flex;
justify-content:center;
align-items:center;
}
2.父元素:{
display:flex;
justify-content:center;
}
子元素:{
align-self:center;
}
还有一种,添加弟弟元素
1.添加一个弟弟元素
2.当前元素与弟弟元素添加display:inline-block;
3.弟弟元素高度设为与父元素同高
4.当前元素与弟弟元素添加vertical-align:middle;
5.父元素添加text-align:center;