如何在 Bootstrap 中将图像居中？

Question

我试图在 Bootstrap 4 Alpha 6 的旋转木马中水平居中图像。

我尝试过的任何方式似乎都不起作用，包括使用center-block.

这是我到目前为止尝试过的：http : //codepen.io/anon/pen/wJdjQg?editors=1100

任何提示？

Answer 1

center-blockmx-auto在 Bootstrap 4. 中被替换为mx-autoauto x 轴边距（margin=left: auto; margin-right: auto）所以它可以用于居中display:block或display:flex元素。

<div class="carousel-item active">
          <img class="img-fluid mx-auto" src="https://unsplash.it/200/200" alt="First slide">
</div>

更多关于 Bootstrap 4 中的居中