Утиліти для верстки
Для швидшої розробки, зручної для мобільних пристроїв, Bootstrap містить десятки службових класів для показу, приховування, вирівнювання та розміщення вмісту.
Використовуйте наші утиліти відображення для швидкого перемикання загальних значень display
властивості. Змішайте його з нашою системою сіток, вмістом або компонентами, щоб відобразити або приховати їх у певних вікнах перегляду.
Bootstrap 4 створено за допомогою flexbox, але не всі елементи display
були змінені, display: flex
оскільки це додало б багато непотрібних перевизначень і несподівано змінило ключову поведінку браузера. Більшість наших компонентів створено з увімкненим flexbox.
Якщо вам потрібно додати display: flex
до елемента, зробіть це за допомогою .d-flex
або одного з адаптивних варіантів (наприклад, .d-sm-flex
). Вам знадобиться цей клас або display
значення, щоб дозволити використовувати наші додаткові утиліти flexbox для визначення розміру, вирівнювання, інтервалів тощо.
Використовуйте утиліти margin
та padding
spacing, щоб контролювати розподіл між елементами та компонентами та їх розмір. Bootstrap 4 містить п’ятирівневу шкалу для утиліт інтервалів на основі значення змінної 1rem
за замовчуванням . $spacer
Виберіть значення для всіх вікон перегляду (наприклад, .mr-3
для margin-right: 1rem
) або виберіть адаптивні варіанти для націлювання на певні вікна перегляду (наприклад, .mr-md-3
для margin-right: 1rem
початку з md
точки зупинки).
Якщо перемикання display
не потрібне, ви можете перемкнути visibility
елемент за допомогою наших утиліт видимості . Невидимі елементи все одно впливатимуть на макет сторінки, але візуально приховані від відвідувачів.