子级盒子在父级盒子中水平垂直居中

方法一

子盒子

position:absolute;

margin:auto;

top:0;

right:0;

bottom:0;

left:0;

方法二

设置父级盒子

display:table-cell; //实现左侧浮动，右侧自适应 但应改回产生影响对后面的块级元素？

vertical-align:middle;

text-align: center;

设置子级盒子：

display:inline-block;

方法三

设置父集盒子display:flex;

justify-content:center;

align-items:center;

设置子级盒子

方法四

设置父级盒子position：relative；

设置子级盒子：position:absolute;left:50%;top:50%;margin-left: -50px;margin-top:-50px;