Посібник з Bootstrap 4

Bootstrap 4 прогрес-бар 0

Bootstrap 4 прогрес-бар

Основний прогрес-бар Прогрес-бар може бути використаний для показу користувачеві, наскільки швидко і на якому етапі знаходиться той чи інший процес виконання певного завдання. Щоб створити прогрес-бар за замовчуванням, додайте клас .progress до елемента контейнера і додайте...

Значки(бейджі) Bootstrap 4 0

Значки(бейджі) Bootstrap 4

Значки використовуються для додавання додаткової інформації до будь-якого вмісту. Використовуйте клас .badge разом з контекстним класом (подібно .badge-secondary) в <span> елементах для створення прямокутних значків. Майте на увазі, що масштаб значків відповідає розміру батьківського елемента (якщо такий існує): See the Pen...

Групи кнопок Bootstrap 4 0

Групи кнопок Bootstrap 4

Bootstrap 4 дозволяє групувати кнопки в ряд. Використовуйте елемент <div> з класом .btn-groupдля створення групи кнопок: See the Pen Групи кнопок by Vladislav Groniuk (@vladislav-groniuk) on CodePen. Порада. Замість застосування розмірів кнопок для кожної кнопки в групі, використовуйте...

bootstrap 4 алерти 0

Bootstrap 4 алерти (сповіщення)

Bootstrap 4 алерти забезпечують простий спосіб створення сповіщень для вашого сайту: See the Pen Bootstrap 4 Alerts by Vladislav Groniuk (@vladislav-groniuk) on CodePen. Сповіщення створюються за допомогою класу  .alert, а потім додається один з контексних...

Jumbotron 0

Bootstrap 4 Jumbotron

Jumbotron створює велике сіре поле для додаткової уваги користувача до певного вмісту або інформації. Порада: всередині даного елемента можна помістити майже будь-який дійсний HTML, включаючи інші елементи / класи Bootstrap. Використовуйте елемент <div> з класом .jumbotron для створення...

Зображення в Bootstrap 4 0

Зображення в Bootstrap 4

Закруглені кути Клас .rounded додає закруглені кути до зображення: See the Pen Заокруглені кути в зображенні by Vladislav Groniuk (@vladislav-groniuk) on CodePen. Коло Клас .rounded-circle формує зображення у вигляді кола: See the Pen Зображення у...

таблиця bootstrap 4 0

Таблиці в Bootstrap 4

Bootstrap 4 Основна таблиця Базова таблиця Bootstrap 4 має невеликі внутрішні відступи і горизонтальні роздільники. Клас .table додає основні стилі до таблиці: See the Pen Базова таблиця by Vladislav Groniuk (@vladislav-groniuk) on CodePen. Смугасті рядки...

Bootstrap 4 кольори 0

Bootstrap 4. Кольори

Кольори для тексту Bootstrap 4 У Bootstrap 4 є певні класи, які задають тим чи іншим елементам потрібні кольори. Ось класи, як змінюють колір тексту: .text-muted, .text-primary, .text-success, .text-info, .text-warning, .text-danger, .text-secondary, .text-white, .text-dark, .text-body( по замовчуванням колір для тега body) і .text-light: See...

Bootstrap 4. Текстові можливості 0

Bootstrap 4. Текстові можливості

Налаштування за замовчуванням Bootstrap 4 використовує значення за замовчуванням font-size16px, і line-height 1,5. Типовим font-familyє “Helvetica Neue”, Helvetica, Arial, sans-serif. Крім того, всі елементи <p>мають margin-top: 0і margin-bottom: 1rem(16px за замовчуванням). <h1> – <h6> Bootstrap 4 стилізує HTML заголовки (...

Сітка Bootstrap 4 0

Сітка Bootstrap 4

Система сітки Bootstrap 4 Сітка Bootstrap 4 побудована на основі технології flexbox і дозволяє створювати до 12 стовпців по всій сторінці. Якщо ви не хочете використовувати всі 12 стовпців окремо, можна згрупувати потрібні стовпці...

Повідомити про помилку

Текст, який буде надіслано нашим редакторам: