css 水平居中

1、text-align: center
行内元素实现在块级元素内部居中

<div class=\"outer\"><p style=\'text-align: center;\'>水平居中</p></div>

2、margin: 0 auto
块级元素两边margin值自动居中

<div class=\"outer\"><div class=\"inner\" style=\'margin:0 auto\'></div></div>

3、display:flex
just-content：center
利用弹性布局flex设置子元素水平居中（父元素设置弹性布局）

<div class=\"outer\" style=\"display: flex; justify-content: center;\"><div class=\"inner\"></div></div>