Bootstrap 4. Контейнери та ключові точки.

Відео: Bootstrap 4 Tutorial Series

Всім привіт! У цій статті ми розглянемо, що таке контейнери і ключові точки і навіщо вони потрібні в Bootstrap 4.

Для початку розберемося, що таке контейнер. контейнер - це сама базова компоновка в Bootstrap.

Відео: Bootstrap 4 Tutorial 21 - Cards

Вони обертають і містять наш контент
Надають базові зовнішні і внутрішні відступи
Допомагають нам центрировать контент на сторінці
Можуть бути мінливими або фіксованими

Тепер відкриємо файл index.html, який ми писали в попередніх статтях, і пропишемо там наступний код:

class="Container"style="background: skyblue"gt; 
 
 
 
class="Container-fluid"style="background: yellow"gt;

Якщо ви тепер відкриєте сторінку в браузері, то побачите, що фіксований контейнер відцентровано і має максимальну ширину, а мінливий - розтягнутий на всю ширину сторінки. Також фіксований контейнер зі зменшенням вікна браузера буде ставати менше, підлаштовуючись під ширину. Так відбувається тому, що є ключові точки, на яких розмір фіксованого контейнера зменшується. Ви можете простежити все це в інструментах розробника.

Відео: REVIEW BOOTSTRAP 4 - O QUE VEM POR AÍ?

Ці ключові точки працюють на медіа-запитах і є дуже корисними. Наприклад, система сіток в Bootstrap автоматично змінюється в залежності від розміру екрана користувача.

А на цьому сьогодні все. Дякую за увагу!

Поділися в соціальних мережах:

Схожі