元素垂直居中方法
1、方案一:
- 给容器设置
position:relative; - 给子元素设置
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
margin:auto;
2、方案二:
- 给容器设置
position:relative; - 给子元素设置
position:absolute;
left:50%;
top:50%;
margin-left:元素自身一半;
margin-top:元素自身一半;
3、方案三:
- 给容器设置
position:relative; - 给子元素设置
position:absolute;
left:50%;
top:50%;
transform:translate(-50%, -50%);
4、方案四:弹性布局
- 给容器设置
display:flex;
justify-content:center;
align-items:center;