垂直居中的办法小结

  • 单行文本的话可以使用height和line-height设置同一高度。
  • position+margin:设置父元素:position: relative;,子元素height: 100px; position:absolute;top: 50%; margin: -50px 0 0 0;(定高)
  • position+transform:设置父元素position:relative,子元素:position: absolute;top: 50%;transform: translate(0, -50%);(不定高)
  • 百搭flex布局(ie10+),设置父元素display:flex;align-items: center;(不定高)
原文地址:https://www.cnblogs.com/wangqiao170/p/10407432.html