块级元素⽔平居中的⽅法？

margin:0 auto ⽅法

.center{
height: 200px;
width:200px;
margin:0 auto;
border:1px solid red;
}
<div class="center">⽔平居中</div>

flex布局，⽬前主流⽅法

.center{
display:flex;
justify-content:center;
}
<div class="center">
<div class="flex-div">1</div>
<div class="flex-div">2</div>
</div>

table⽅法

.```js center{ display:table; margin:0 auto; border:1px solid red; }

扩展：16种方法实现水平居中垂直居中https://louiszhai.github.io/2016/03/12/css-center/