Перейти к основному содержанию
Есть более новая версия Bootstrap 4!

Примеры

Быстро начните проект с любым из наших примеров, начиная от использования частей фреймворка и заканчивая пользовательскими компонентами и макетами.

Скачать исходный код

Пользовательские компоненты

Совершенно новые компоненты и шаблоны, которые помогут людям быстро начать работу с Bootstrap и продемонстрируют передовой опыт добавления в фреймворк.

Скриншот альбома
Альбом

Простой одностраничный шаблон для фотогалерей, портфолио и многого другого.

Скриншот цен
Цены

Пример страницы с ценами, созданной с помощью карточек и имеющей настраиваемый верхний и нижний колонтитулы.

Скриншот оформления заказа
Проверить

Пользовательская форма оформления заказа, показывающая наши компоненты формы и их функции проверки.

Скриншот продукта
Товар

Простая маркетинговая страница, ориентированная на продукт, с обширной сеткой и изображениями.

Скриншот обложки
Покрытие

Одностраничный шаблон для создания простых и красивых домашних страниц.

Скриншот карусели
Карусель

Настройте панель навигации и карусель, а затем добавьте несколько новых компонентов.

Скриншот блога
Блог

Журнал как шаблон блога с заголовком, навигацией, избранным контентом.

Скриншот приборной панели
Приборная доска

Базовая оболочка панели администратора с фиксированной боковой панелью и панелью навигации.

Скриншот входа
Войти

Пользовательский макет формы и дизайн для простой формы входа.

Закрепленный скриншот нижнего колонтитула
Липкий нижний колонтитул

Прикрепите нижний колонтитул к нижней части окна просмотра, если содержимое страницы короткое.

Скриншот липкой панели навигации нижнего колонтитула
Липкая панель навигации нижнего колонтитула

Прикрепите нижний колонтитул к нижней части окна просмотра с фиксированной верхней панелью навигации.

Рамки

Примеры, посвященные реализации использования встроенных компонентов, предоставляемых Bootstrap.

Скриншот стартового шаблона
Стартовый шаблон

Ничего, кроме основ: скомпилированные CSS и JavaScript.

Скриншот сетки
Сетка

Несколько примеров макетов сетки со всеми четырьмя уровнями, вложением и т. д.

Скриншот Джамботрона
Джамботрон

Создайте вокруг джамботрона панель навигации и несколько основных столбцов сетки.

Взяв компонент панели навигации по умолчанию и показав, как его можно перемещать, размещать и расширять.

Скриншот панели навигации
Навбары

Демонстрация всех адаптивных и контейнерных опций для панели навигации.

Статический скриншот панели навигации
Статическая панель навигации

Одиночный пример статической верхней панели навигации вместе с некоторым дополнительным содержимым.

Исправлен скриншот навбара
Навбар исправлен

Пример одной панели навигации с фиксированной верхней панелью навигации вместе с некоторым дополнительным содержимым.

Нижний скриншот панели навигации
Нижняя панель навигации

Пример одной панели навигации с нижней панелью навигации и некоторым дополнительным содержимым.

Эксперименты

Примеры, которые фокусируются на перспективных функциях или методах.

Скриншот с плавающими метками
Плавающие этикетки

Красивые простые формы с плавающими метками над вашими входными данными.

Скриншот вне холста
Offcanvas

Превратите расширяемую панель навигации в скользящее меню вне холста.