主要介绍元素垂直的一些技巧,水平同理
1 vertical-align: middle;
前提:父元素display: table-cell; vertical-align: middle;
2 align-items: center;
前提:父元素display: flex; align-items: center;
3 align-self: center;
前提:父元素display: flex; 子元素align-self: center;
4 transform: translateY(-50%)
前提:子元素存在定位,top: 50%; transform: translateY: (-50%);
5 margin: auto;
前提:子元素相对父元素绝对定位position: absolute; top; 0; bottom: 0; margin: auto;
6 line-height: xxx;
前提:子元素为单行文本, line-height: xxx; (xxx为父容器height大小)