Bootstrap中心标题

Question

这是我的第一个Twitter Bootstrap体验.我添加了一些标题(h1,h2等),它们在左侧对齐.以标题为中心的正确方法是什么？

Answer 1

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

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

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

bootstrap为文本对齐添加了三个css类.

Answer 2

只需在元素中使用class ='text-center'作为中心标题.

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

在左边标题的元素中使用class ='text-left',在元素中使用class ='text-right'作为右标题.

Answer 3

只需在该行的class属性中使用“ justify-content-center”即可。

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

为什么这么复杂？根据[Sadegh-khan的回答](/sf/answers/2616563001/)，`<h1 class="text-center">`不是更简单吗？ (2认同)
当使用 bootstrap 时，使用此选项可以使标题集中在 div 中，而使用 text-center 则无法做到这一点。它使标题出现在屏幕中间，这正是我的目标。 (2认同)

Answer 4

根据您的意见,要将所有标题集中在一起,您需要同时添加所有标题text-align:center,如下所示:

CSS

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

Answer 5

Bootstrap带有许多预构建类，其中一个是class="text-left"。请在需要时致电该班。:-)