垂直居中

 

  1:flex布局  

http://www.myexception.cn/flex/2025243.html  flex布局实现垂直居中   
http://caibaojian.com/demo/flexbox/justify-content.html  justify-content (适用于父类容器上) 

  2:table-cell  

http://www.zhangxinxu.com/wordpress/2010/10/%E6%88%91%E6%89%80%E7%9F%A5%E9%81%93%E7%9A%84%E5%87%A0%E7%A7%8Ddisplaytable-cell%E7%9A%84%E5%BA%94%E7%94%A8/

  3:绝对定位 

http://www.cnblogs.com/zhouhuan/p/vertical_center.html

除了可以使用margin-top把div往上偏移之外,CSS3的transform属性也可以实现这个功能,通过设置div的transform: translateY(-50%),意思是使得div向上平移(translate)自身高度的一半(50%)。如下

  4:line-height vertical

  5: 其他方法

原文地址:https://www.cnblogs.com/xiaozhumaopao/p/7451954.html