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

Bootstrap CSS типографика Ссылка


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

Bootstrap's глобальным по умолчанию font-size является 14px, с line-height в 1.428.

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

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


Типография

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

Приведенные ниже классы используются для оформления элементов дополнительно.

Элемент / Класс Описание пример
<h1> - <h6>
or
.h1 - .h6
h1 - h6 заголовки Попробуй
<small> Создает более легкий, вторичный текст в любой позиции

Заголовок (вторичный текст)

Попробуй
.small Указывает меньший текст (установлен на 85% от размера родителя): меньше текста Попробуй
.lead Делает текст выделяются: Выделиться текст Попробуй
<mark>
or
.mark
Основные текст: Выделенный текст Попробуй
<del> Указывает удаленный текст: Удаленный текст Попробуй
<s> Указывает больше не соответствующий текст: больше не соответствующий текст Попробуй
<ins> Указывает, вставленный текст: вставленный текст Попробуй
<u> Указывает , подчеркнутый текст: подчеркнутый текст Попробуй
<strong> Указывает жирный текст: Жирный Попробуй
<em> Указывает курсивом: Курсив Попробуй
.text-left Указывает, по левому краю текста Попробуй
.text-center Указывает, выровнен по центру текста Попробуй
.text-right Указывает выравнивание по правому краю текста Попробуй
.text-justify Указывает, выровненный текст Попробуй
.text-nowrap Указывает на отсутствие текста обруча Попробуй
.text-lowercase Указывает строчными текст: строчными ТЕКСТ Попробуй
.text-uppercase Указывает верхний регистр текст: текст в верхний регистр Попробуй
.text-capitalize Указывает текст капитализированную: заглавных букв Попробуй
<abbr> <abbr> элемент указывает на сокращение или акроним. Сокращения с названием атрибута имеют пунктирную нижнюю границу и справки курсор на парении, обеспечивая дополнительный контекст на парении. Попробуй
.initialism Отображает текст внутри <abbr> элемент в немного меньший размер шрифта Попробуй
<address> Представляет контактную информацию Попробуй
<blockquote> Указывает блоки контента из другого источника Попробуй
.blockquote-reverse Указывает на BLOCKQUOTE с правой выровненных содержания Попробуй
<ul> Указывает неупорядоченный список Попробуй
<ol> Указывает упорядоченный список Попробуй
.list-unstyled Удаляет список-стиль по умолчанию и левый край по элементам списка (работает на обоих <ul> и <ol> ). Этот класс применяется только к элементам списка непосредственных детей (чтобы удалить список-стиль по умолчанию из любых вложенных списков, применять этот класс для любых вложенных списков, а) Попробуй
.list-inline Места все Элементы списка в одной строке Попробуй
<dl> Указывает список описание Попробуй
.dl-horizontal Выстраивает терминов и описаний в <dl> элемент бок о бок. Начинается , как по умолчанию <dl>s , но когда расширяет окно браузера, он будет выстраиваться бок о бок Попробуй

Код

Элемент / Класс Описание пример
<var> Указывает переменные: x = a b + y Попробуй
<kbd> Указывает вход , который , как правило , ввод символов с клавиатуры: CTRL + P Попробуй
<pre> Указывает на несколько строк кода Попробуй
<pre class="pre-scrollable"> Указывает на несколько строк кода с полосой прокрутки Попробуй
<samp> Показывает пример выходных данных компьютерной программы: Пример вывода Попробуй
<code> Указывает , встроенные фрагменты кода: span , div Попробуй