css 元素上下居中

css 中的元素加了position:absolute的时候，该元素已经脱离了文档流了，其高度和宽度已经不在

1. float: 当把行内元素设置完float:left/right后，该行内元素的display属性会被赋予block值，且拥有浮动特性。行内元素去除了之间的莫名空白。
2. 如果要水平居中：text-align:center，
3. 上下垂直居中padding:10px 0
4. 水平和垂直都居中：padding: 70px 0;   text-align: center:
   所有的代码都在这里：
5. 使用flex弹性盒子模型来实现左右上下居中：对要居中的内容的父元素使用   
   display:flex;
   justify-content:center;
   align-items:center;
   这样内部的元素会变成行内元素，进行居中。
   如果需要还是保持块级元素，即每个div一行，那么需要设置:flex-direction:column;即可保持正常的
7. CSS 布局 – 水平 & 垂直对齐 | 菜鸟教程 (runoob.com)https://www.runoob.com/css/css-align.html