html+css水平居中和垂直居中
水平居中
1.定宽。左右:margin:auto
2.弹性盒设置 justify—content:center
3.父元素设置 text-align:center
4相对定位元素 left:0;right:0;定宽:左右margin:auto
5.相对定位元素 margin-left:50%;transform:translateX(-50%)【margin,padding相对于包含块宽度的百分比】
垂直居中
1.line-height【单行文本垂直居中】
2.弹性盒设置 align-items:center
3.相对定位元素 top:0;bottom:0;定高:上下 margin:auto
4.相对定位元素,top:50%,transform:translateY(-50%)
相对元素水平垂直居中
position:relative;
top:50%
left:50%
teansform:translate(-50%,-50%)