Bootstrap 提供四种水平居中元素的方法:使用 .text-center 类使用 justify-content 实用程序使用 margin: auto使用辅助类 .mx-auto

Bootstrap 居中显示元素
Bootstrap 提供了几种方法来水平居中显示元素:
使用 .text-center 类
.text-center 类应用于要居中的元素。<p class="text-center">Hello</p>
使用 justify-content 实用程序
justify-content 实用程序。row 类创建一个行,然后将 justify-content-center 应用于该行。内部元素会自动居中。`<div class="row justify-content-center">
<div class="col">Item 1</div>
<div class="col">Item 2</div>
</div>`
使用 margin: auto
margin: auto 实用程序。<div style="margin: auto;">Item</div>
使用辅助类
.mx-auto 的辅助类,它为元素添加 margin: auto 样式。<div class="mx-auto">Item</div>
注意:
以上就是bootstrap如何居中显示的详细内容,更多请关注php中文网其它相关文章!
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号