css水平垂直居中总共有四种方法
① 使用绝对定位
注意:使用绝对定位居中需要固定宽高
position:absolute;top:0;left:0;bottom:0;right:0;width:xxx;height:xxx;margin:auto;
②使用绝对定位 + calc()
需要知道具体的元素宽高值position:absolute;width:xxx;height:xxx;top:calc(50% - xxx/2);left:calc(50% - xxx/2);
③使用绝对定位 + transform
不需要知道元素的宽高position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)
④使用弹性布局
display:flex;justify-content:center;align-items:center;