居中系列

水平居中

行内元素

text-align: center

块级元素

margin: 0 auto

或者

position: absolute; 
left: 50%;
transform: translateX(-50%)

或者

display: flex
justify-content: center

垂直居中

行级元素

line-height = height

块级元素

position: absolute
top: 50%
transform: translateY(-50%)

或者

display:flex 
align-items: center

或者

display:table
display:table-cell
vertical-align: middle