Типографика

Стили текстовых блоков Bifilux

Эта страница показывает базовые элементы оформления, которые уже поддерживаются темой:
заголовки, абзацы, ссылки, списки, цитаты, акцентные блоки, таблицы, код и изображения.

Заголовки

Заголовок H1

Заголовок H2

Заголовок H3

Заголовок H4

Заголовок H5

Заголовок H6

Обычный текст

Обычный абзац текста внутри .page-content. Он получает базовую типографику сайта:
размер, межстрочный интервал, отступы и цвет.

Можно использовать жирный текст, курсив и
обычную ссылку.

Списки

Маркированный список

Первый пункт списка
Второй пункт списка
Третий пункт списка с более длинным текстом

Нумерованный список

Первый шаг
Второй шаг
Третий шаг

Цитата

Это стандартный блок цитаты blockquote. Тема оформляет его светлым фоном,
левой цветной линией и внутренними отступами.

Акцентный блок

Для такого оформления используется класс:
accent-block accent-block--blue.

Подходит для важных примечаний
Можно использовать заголовки, текст и списки
Цвет и радиусы берутся из темы

Таблица

Класс	Для чего используется	Пример применения
`page-content`	Базовая типографика страницы	Обертка для текстового контента
`accent-block`	Акцентный информационный блок	Важное сообщение или примечание
`accent-block--blue`	Синий градиентный вариант акцентного блока	Используется вместе с `accent-block`
`table-responsive`	Адаптивная обертка таблицы	Добавляет горизонтальную прокрутку на мобильных
`bifilux-table`	Оформление таблицы	Применяется к тегу `table`

Код

Внутри текста можно выделять короткий код так:
<div class="accent-block accent-block--blue">.

<div class="accent-block accent-block--blue">
  <h3>Заголовок блока</h3>
  <p>Текст внутри акцентного блока.</p>
</div>

Изображение с подписью

Пример изображения — Подпись к изображению через тег `figcaption`.

💡

Обратите внимание:
Наши штаммы бактерий проходят многоступенчатую проверку качества перед тем, как попасть на производственную линию.
Вы можете узнать больше на странице
сертификатов.