CSS 样式：常用居中方法

下面是一些常用的能实现居中的方法

水平居中：

1.左右margin为auto。（常规流块盒、弹性盒子不用定宽）；

2.弹性盒子设置justify-content:center；让弹性项目在主轴上居中；

3.父元素设置text-align：center；让其内部的文本居中；

4.相对定位元素，margin-left：50%；transform：translateX（50%）；

垂直居中：

1.单行文本垂直居中，设置父元素line-height为包含块高度；

2.弹性盒设置align-items：center，让弹性盒子在侧轴上居中；

3.相对定位元素，top：50%；transform:translateY(50%);