Теги: Bootstrap
04.07.2019
Создание горизонтального адаптивного меню для сайта осуществляется с помощью компонента «Navbar». Компонент имеет два режима отображения: десктопный (выводятся все элементы меню) и мобильный (отображается бренд и кнопка «Гамбургер»). Режим отображения зависит от ширины viewport браузера.
30.06.2019
Навигационная панель может быть реализована в виде ссылок, вкладок (tabs) или кнопок (pills). Создание панели начинается с маркированного списка, к которому добавляется базовый класс nav. Если к списку добавить класс nav-tabs — получим вкладки, если добавить класс nav-pills — получим кнопки.
30.06.2019
Сообщения (alerts) предназначены для выделения на веб-странице некоторой информации с целью привлечения к ней внимания пользователя. Наиболее часто данный компонент используют для отображения ошибок и предупреждений при валидации форм.
29.06.2019
Компонент предназначен для отображения на странице изначально скрытого контента. При появлении по какому-либо событию, модальное окно затемняет всю страницу и отображается поверх остальных элементов. Окно представляет собой контейнер, который содержит заголовок, основное содержимое и подвал.
28.06.2019
Компонент «Карточка» предназначен для оформления блока с текстом. Карточка имеет гибкую структуру — можно добавить шапку, подвал, список, картинку. Кроме этого, карточке можно придать нужное цветовое оформление — задать цвет фона, текста и границ.
27.06.2019
Компонент «Формы» — это набор CSS-классов, которые предназначены для оформления HTML форм: form-group, form-control, input-group, input-group-prepend, input-group-text, form-row, form-inline, invalid-feedback, valid-feedback, is-invalid, is-valid.
19.06.2019
По умолчанию адаптивные блоки визуально отображаются в том порядке, в котором они расположены в HTML коде. Изменить визуальный порядок следования адаптивного блока выполняется посредством класса order-{1…12}. Этот класс предназначен xs устройств. Для изменения порядка для sm, md, lg и xl используется…
18.06.2019
Адаптивная сетка Bootstrap 4 построена на основе Flexbox. Основой сетки является класс row в качестве родительского контейнера для нескольких адаптивных блоков. Для класса row задано свойство display:flex, а дочерние элементы делят его пространство на части, но для разных разрешений экрана — по разному.
17.06.2019
Bootstrap 4 — это открытый и бесплатный HTML, CSS и JS фреймворк, который используется веб-разработчиками для быстрого создания адаптивных дизайнов сайтов. В сущности — это просто набор сss- и js-файлов. После подключения этих файлов к странице станут доступны большое количество готовых классов и компонентов.
01.03.2016
Компонент Jumbotron предназначен для размещения контента на сайте, который занимает всю ширину контейнера и является очень большим, чтобы пользователи обратили на него внимание. Компонент Well позволяет выделить какой-то контент на странице с помощью рамки и фона.