Последние учебники веб-разработки
 

Bootstrap Текст / Книгопечатание


Bootstrap's умолчанию Настройки

Bootstrap's глобальным по умолчанию размер шрифта является 14px, с очередью высотой 1.428.

Это применяется к <body> и все пункты.

Кроме того, все <p> элементы имеют нижнюю границу , которая равна половине их вычисленного высоту строки (10px по умолчанию).


Bootstrap против значения по умолчанию браузера

В этой главе мы рассмотрим некоторые HTML - элементы , которые будут стилизованных немного по- разному Bootstrap , чем браузер по умолчанию.


<h1> - <h6>

По умолчанию, Bootstrap будет стилизовать HTML заголовков ( <h1> до <h6> ) следующим образом:

пример

h1 Bootstrap heading (36px)

h2 Bootstrap heading (30px)

h3 Bootstrap heading (24px)

h4 Bootstrap heading (18px)

h5 Bootstrap heading (14px)
h6 Bootstrap heading (12px)
Попробуй сам "

<small>

В грузиться HTML <small> элемент используется для создания более легкого, вторичный текст в любой позиции:

пример

h1 heading secondary text

h2 heading secondary text

h3 heading secondary text

h4 heading secondary text

h5 heading secondary text
h6 heading secondary text
Попробуй сам "

<mark>

Bootstrap будет стилизации HTML <mark> элемент следующим образом:

пример

Use the mark element to highlight text.

Попробуй сам "

<abbr>

Bootstrap будет стилизации HTML <abbr> элемент следующим образом:

пример

The WHO was founded in 1948.

Попробуй сам "

<blockquote>

Bootstrap будет стилизации HTML <blockquote> элемент следующим образом:

пример

For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.

From WWF's website
Попробуй сам "

Для того, чтобы показать цитату справа, используйте .blockquote-reverse класс:

пример

For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.

From WWF's website
Попробуй сам "

<dl>

Bootstrap будет стилизации HTML <dl> элемент следующим образом:

пример

Coffee
- black hot drink
Milk
- white cold drink
Попробуй сам "

<code>

Bootstrap будет стилизации HTML <code> элемент следующим образом:

пример

The following HTML elements: span , section , and div defines a section in a document.

Попробуй сам "

<kbd>

Bootstrap будет стилизации HTML <kbd> элемент следующим образом:

пример

Use ctrl + p to open the Print dialog box.

Попробуй сам "

<pre>

Bootstrap будет стилизации HTML <pre> элемент следующим образом:

пример

Text in a pre element
is displayed in a fixed-width
font, and it preserves
both      spaces and
line breaks.
Попробуй сам "

Контекстные Цвета и обои

Bootstrap также имеет некоторые контекстные классы , которые могут быть использованы для обеспечения "означает через цветов".

Классы для текстовых цветов: .text-muted , .text-primary , .text-success , .text-info , .text-warning , и .text-danger :

пример

This text is muted.

This text is important.

This text indicates success.

This text represents some information.

This text represents a warning.

This text represents danger.

Попробуй сам "

Классы для цвета фона являются: .bg-primary , .bg-success , bg-info , bg-warning , и .bg-danger :

пример

This text is important.

This text indicates success.

This text represents some information.

This text represents a warning.

This text represents danger.

Попробуй сам "

Другие классы Книгопечатания

Классы Bootstrap ниже могут быть добавлены в стиле HTML-элементов далее:

Класс Описание пример
.lead Заставляет абзац выделяется Попробуй
.small Указывает меньший текст (устанавливается на 85% от размера родителя) Попробуй
.text-left Указывает, по левому краю текста Попробуй
.text-center Указывает, выровнен по центру текста Попробуй
.text-right Указывает выравнивание по правому краю текста Попробуй
.text-justify Указывает, выровненный текст Попробуй
.text-nowrap Указывает на отсутствие текста обруча Попробуй
.text-lowercase Указывает текст строчными Попробуй
.text-uppercase Указывает текст в верхний регистр Попробуй
.text-capitalize Указывает текст капитализированную Попробуй
.initialism Отображает текст внутри <abbr> элемент в немного меньший размер шрифта Попробуй
.list-unstyled Удаляет список-стиль по умолчанию и левый край по элементам списка (работает на обоих <ul> и <ol> ). Этот класс применяется только к элементам списка непосредственных детей (чтобы удалить список-стиль по умолчанию из любых вложенных списков, применять этот класс для любых вложенных списков, а) Попробуй
.list-inline Места все Элементы списка в одной строке Попробуй
.dl-horizontal Выстраивает условиям ( <dt> ) и описания ( <dd> ) в <dl> элементы бок о бок. Начинается , как по умолчанию <dl> с, но когда расширяет окно браузера, он будет выстраиваться бок о бок Попробуй
.pre-scrollable Делает <pre> элемент прокручивать Попробуй

Полное Bootstrap Typography Reference

Для полного ведения всех типографики элементов / классов, перейдите на наш полный Bootstrap Типографии Reference .

Также обратите внимание на наш Bootstrap вспомогательные классы Reference для получения дополнительной информации о контекстных классах.