引导中心航向

这是我第一次体验 Bootstrap。我已经添加了一些标题(h1、 h2等) ，它们在左侧对齐。中心标题的正确方法是什么？

263634 次浏览

小开

根据你的评论，把所有的标题放在中间，你要做的就是同时把 text-align:center加到所有的标题上，像这样:

CSS

    h1, h2, h3, h4, h5, h6 {
text-align: center;
}

小开

最佳答案

.text-left {
text-align: left;
}


.text-right {
text-align: right;
}


.text-center {
text-align: center;
}

Bootstrap 为文本对齐添加了三个 css 类。

小开

只要使用 <h>元素中的 class='text-center'作为中心标题:

<h2 class="text-center">sample center heading</h2>

在 <h>元素中使用 class='text-left'作为左标题, 在 <h>元素中使用 class='text-right'作为右标题。

小开

Bootstrap 提供了许多预构建类，其中之一是 class="text-left"。请在需要时调用这个类。 : -)

小开

只需在行的 class 属性中使用“免费-内容中心”即可。

<div class="container">
<div class="row justify-content-center">
<h1>This is a header</h1>
</div>
</div>

小开

在当前版本的 bootstrap 5.2.0中，它是: 文本中心，(中心) text-end, (right) Text-start (左)。

<p class="text-start">Start aligned text on all viewport sizes.</p>
<p class="text-center">Center aligned text on all viewport sizes.</p>
<p class="text-end">End aligned text on all viewport sizes.</p>