元素水平垂直居中的方式
元素水平垂直居中的方式
- 弹性盒:
父元素: display: flex;
子元素: margin: auto; - 弹性盒2:
父元素:display:flex;
justify-content: center;
align-item: center; - 定位1:
父元素:position: relative;
子元素:position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto; - 定位加2d变形
父元素: position:relative;
子元素:position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);