Hugo Zina - Размеры основного контента

Матеріал з Wiki.Zina
Версія від 08:54, 3 квітня 2020, створена Romych (обговорення | внесок)
(різн.) ← Попередня версія | Поточна версія (різн.) | Новіша версія → (різн.)
Перейти до навігації Перейти до пошуку

←Hugo Zina

Набор стилей для создания блоков основного контента разной ширины:

assets/sass/layout/_default.scss

<div class="container mb-4">
  <div class="row brdr">
    <div class="cols-1-8-3 brdr-black">
      <strong>cols-1-8-3</strong> Основной шаблон внутренних страниц: основное поле 8 колонок с отступом слева 1 колонка и справа 3 колонки
    </div>
  </div>
</div>

<div class="container mb-4">
  <div class="row brdr">
    <div class="cols-1-10-1 brdr-black">
      <strong>cols-1-10-1</strong> Текстовый блок по центру: основное поле 10 колонок, слева и справа отсупы по 1 колонке
    </div>
  </div>
</div>

<div class="container mb-4">
  <div class="row brdr">
    <div class="cols-2-8-2 brdr-black">
      <strong>cols-2-8-2</strong>
    </div>
  </div>
</div>

<div class="container mb-4">
  <div class="row brdr">
    <div class="cols-3-6-3 brdr-black">
      <strong>cols-3-6-3</strong>
    </div>
  </div>
</div>

<div class="container mb-4">
  <div class="row brdr">
    <div class="cols-0-11-1 brdr-black">
      <strong>cols-0-11-1</strong> Основной текст 11 колонок, справа отсуп 1 колонка
    </div>
  </div>
</div>

<div class="container mb-4">
  <div class="row brdr">
    <div class="cols-2-9-1 brdr-black">
      <strong>cols-2-9-1</strong> Основной текст 9 колонк, слева отсуп 2 колонки, справа - 1 колонка
    </div>
  </div>
</div>

<div class="container mb-4">
  <div class="row brdr">
    <div class="content-header brdr-black">
      <strong>content-header</strong> Верхняя часть страницы, 1-8-3, справа доп.навигация
    </div>
  </div>
</div>