Заголовок центра начальной загрузки

93

Это мой первый опыт работы с Twitter Bootstrap. Я добавил несколько заголовков (h1, h2 и т. Д.), И они выровнены по левому краю. Как правильно центрировать заголовки?

twitter-bootstrap

— СибирскийГай
источник

Как вы размещаете заголовки? Внутри контейнера, как pбирка, или без упаковки?

— Андрес Ильич

@AndresIlich, внутри row-fluide (который находится внутри container-fluide)

— SiberianGuy

вы хотите центрировать все заголовки? или только несколько избранных?

— Андрес Ильич

@AndresIlich, я хочу, чтобы все заголовки были по центру по умолчанию

— SiberianGuy

141

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

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

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

bootstrap добавил три класса css для выравнивания текста.

— Цзиньпу Ху
источник

69

просто используйте class = 'text-center' в элементе для центрального заголовка.

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

используйте class = 'text-left' в элементе для левого заголовка и используйте class = 'text-right' в элементе для правого заголовка.

— Садег-хан
источник

29

Просто используйте «justify-content-center» в атрибуте класса строки.

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

— Юфренч
источник

2

К чему вся эта сложность? Разве не <h1 class="text-center">проще, как ответил Садег-хан ?

— Марко Сулла,

Использование этого позволяет централизовать заголовок в div при использовании начальной загрузки, чего не было при использовании text-center. Заголовок появляется в центре экрана, к чему я и стремился.

— a.norman

11

Согласно вашим комментариям, чтобы центрировать все заголовки, все, что вам нужно сделать, это добавить text-align:centerих все одновременно, например:

CSS

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

— Андрес Ильич
источник

1

Хотя это правда, идея использования twitter bootstrap заключается в максимально возможном использовании существующих классов. См. Ответ

— Цзиньпу

@Skurpi Frameworks действуют как предложения относительно того, что вы можете использовать в проекте; Они ни в коем случае не даны. Хотя проще использовать классы и стили, уже указанные в начальной загрузке, если требования вашего проекта «требуют», чтобы вы внесли некоторые радикальные изменения в структуру, на вопрос OP, то самый простой способ сделать это - просто изменить эти изменения на корневой уровень. В отличие от добавления тонны классов, которые вам действительно не нужны.

— Андрес Ильич

@Skurpi Кроме того, эти классы выравнивания не существовали на момент написания. Этому ответу год.

— Андрес Ильич

Ильич Вы правы, не смотрел дату этого вопроса, когда приехал сюда

— Скурпи

5

Bootstrap поставляется с множеством классов предварительной сборки, и один из них - class="text-left". При необходимости звоните в этот класс. :-)

— Tinsae
источник