Заголовки
Вы можете изменить оформление заголовков с помощью специальных модификаторов.
Выделение заголовков
Для того чтобы заголовки имели особое оформление, необходимо использовать для них дополнительный класс .sf-title.
h1. Заголовок 1-го уровня
h2. Заголовок 2-го уровня
h3. Заголовок 3-го уровня
h4. Заголовок 4-го уровня
h5. Заголовок 5-го уровня
h6. Заголовок 6-го уровня
<h1 class="sf-title">h1. Заголовок 1-го уровня</h1>
<h2 class="sf-title">h2. Заголовок 2-го уровня</h2>
<h3 class="sf-title">h3. Заголовок 3-го уровня</h3>
<h4 class="sf-title">h4. Заголовок 4-го уровня</h4>
<h5 class="sf-title">h5. Заголовок 5-го уровня</h5>
<h6 class="sf-title">h6. Заголовок 6-го уровня</h6>Оформление заголовков
Используйте дополнительные классы для оформления заголовков:
.sf-title-underline-center- заголовк по центру, нижнее подчеркивание одинарной линией, цветом primary.sf-title-underline-centercenter-double- заголовок по центру, нижнее подчеркивание двойной линией цветом primary.sf-title-underline-left- заголовок по левому краю, нижнее подчеркивание одинарной линией цветом primary.sf-title-underline-line- бледная линиия по центру текста
Вы можете применять данные классы как непосредственно для элемента, так и для вышестоящего элемента. В этом случае стиль применяется только к элементам с классом .sf-title.
h1. Заголовок 1-го уровня
h1. Заголовок 1-го уровня
<h1 class="sf-title sf-title-underline-center">h1. Заголовок 1-го уровня</h1>
<div class="sf-title-underline-center"><h1 class="sf-title">h1. Заголовок 1-го уровня</h1></div>Оформление нижним подчеркиванием.
Используйте класс .sf-title-underline-center для подчеркивания заголовков линией цвета primary с размещением заголовка по центру
h1. Заголовок 1-го уровня
h2. Заголовок 2-го уровня
h3. Заголовок 3-го уровня
h4. Заголовок 4-го уровня
h5. Заголовок 5-го уровня
h6. Заголовок 6-го уровня
<h1 class="sf-title sf-title-center-underline">h1. Заголовок 1-го уровня</h1>
<h2 class="sf-title sf-title-center-underline">h2. Заголовок 2-го уровня</h2>
<h3 class="sf-title sf-title-center-underline">h3. Заголовок 3-го уровня</h3>
<h4 class="sf-title sf-title-center-underline">h4. Заголовок 4-го уровня</h4>
<h5 class="sf-title sf-title-center-underline">h5. Заголовок 5-го уровня</h5>
<h6 class="sf-title sf-title-center-underline">h6. Заголовок 6-го уровня</h6>Оформление двойным нижним подчеркиванием
Используйте класс .sf-title-underline-center для двойного подчеркивания заголовков линией цвета primary с размещением заголовка по центру
h1. Заголовок 1-го уровня
h2. Заголовок 2-го уровня
h3. Заголовок 3-го уровня
h4. Заголовок 4-го уровня
h5. Заголовок 5-го уровня
h6. Заголовок 6-го уровня
<h1 class="sf-title sf-title-center-underline-double">h1. Заголовок 1-го уровня</h1>
<h2 class="sf-title sf-title-center-underline-double">h2. Заголовок 2-го уровня</h2>
<h3 class="sf-title sf-title-center-underline-double">h3. Заголовок 3-го уровня</h3>
<h4 class="sf-title sf-title-center-underline-double">h4. Заголовок 4-го уровня</h4>
<h5 class="sf-title sf-title-center-underline-double">h5. Заголовок 5-го уровня</h5>
<h6 class="sf-title sf-title-center-underline-double">h6. Заголовок 6-го уровня</h6>Оформление левым подчеркиванием
Используйте класс .sf-title-underline-left для левого подчеркивания заголовков линией цвета primary с размещением заголовка по левому краю
h1. Заголовок 1-го уровня
h2. Заголовок 2-го уровня
h3. Заголовок 3-го уровня
h4. Заголовок 4-го уровня
h5. Заголовок 5-го уровня
h6. Заголовок 6-го уровня
<h1 class="sf-title sf-title-center-underline-left">h1. Заголовок 1-го уровня</h1>
<h2 class="sf-title sf-title-center-underline-left">h2. Заголовок 2-го уровня</h2>
<h3 class="sf-title sf-title-center-underline-left">h3. Заголовок 3-го уровня</h3>
<h4 class="sf-title sf-title-center-underline-left">h4. Заголовок 4-го уровня</h4>
<h5 class="sf-title sf-title-center-underline-left">h5. Заголовок 5-го уровня</h5>
<h6 class="sf-title sf-title-center-underline-left">h6. Заголовок 6-го уровня</h6>Оформление левым подчеркиванием
Используйте класс .sf-title-line для размещения загловка на линии
h1. Заголовок 1-го уровня
h2. Заголовок 2-го уровня
h3. Заголовок 3-го уровня
h4. Заголовок 4-го уровня
h5. Заголовок 5-го уровня
h6. Заголовок 6-го уровня
<h1 class="sf-title sf-title-line">h1. Заголовок 1-го уровня</h1>
<h2 class="sf-title sf-title-line">h2. Заголовок 2-го уровня</h2>
<h3 class="sf-title sf-title-line">h3. Заголовок 3-го уровня</h3>
<h4 class="sf-title sf-title-line">h4. Заголовок 4-го уровня</h4>
<h5 class="sf-title sf-title-line">h5. Заголовок 5-го уровня</h5>
<h6 class="sf-title sf-title-line">h6. Заголовок 6-го уровня</h6>