css 元素上下居中

css 元素上下居中

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

float: 当把行内元素设置完float:left/right后，该行内元素的display属性会被赋予block值，且拥有浮动特性。行内元素去除了之间的莫名空白。

如果要水平居中：text-align:center，

上下垂直居中padding:10px 0

水平和垂直都居中：padding: 70px 0;   text-align: center: 所有的代码都在这里：

使用flex弹性盒子模型来实现左右上下居中：对要居中的内容的父元素使用    display:flex; justify-content:center; align-items:center; 这样内部的元素会变成行内元素，进行居中。 如果需要还是保持块级元素，即每个div一行，那么需要设置:flex-direction:column;即可保持正常的

CSS 布局 – 水平 & 垂直对齐 | 菜鸟教程 (runoob)www.runoob/css/css-align.html