如何在Flexbox中对齐中心

Flexbox已成为我最喜欢的在页面上居中放置元素的方法。

您将物品包装在div,然后您设置display: flexjustify-content: center

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

使用Tailwind CSS更加容易,您所要做的就是添加flexjustify-center类:

<div class="flex justify-center">
   ...
</div>

免费下载我的CSS手册


更多CSS教程: