Примеры
Быстро начните проект с любым из наших примеров, начиная от использования частей фреймворка и заканчивая пользовательскими компонентами и макетами.
Скачать исходный кодСовершенно новые компоненты и шаблоны, которые помогут людям быстро начать работу с Bootstrap и продемонстрируют передовой опыт добавления в фреймворк.
![Скриншот альбома](/docs/4.0/examples/screenshots/album.png)
Альбом
Простой одностраничный шаблон для фотогалерей, портфолио и многого другого.
![Скриншот цен](/docs/4.0/examples/screenshots/pricing.png)
Цены
Пример страницы с ценами, созданной с помощью карточек и имеющей настраиваемый верхний и нижний колонтитулы.
![Скриншот оформления заказа](/docs/4.0/examples/screenshots/checkout.png)
Проверить
Пользовательская форма оформления заказа, показывающая наши компоненты формы и их функции проверки.
![Скриншот продукта](/docs/4.0/examples/screenshots/product.png)
Товар
Простая маркетинговая страница, ориентированная на продукт, с обширной сеткой и изображениями.
![Скриншот обложки](/docs/4.0/examples/screenshots/cover.png)
Покрытие
Одностраничный шаблон для создания простых и красивых домашних страниц.
![Скриншот карусели](/docs/4.0/examples/screenshots/carousel.png)
Карусель
Настройте панель навигации и карусель, а затем добавьте несколько новых компонентов.
![Скриншот блога](/docs/4.0/examples/screenshots/blog.png)
Блог
Журнал как шаблон блога с заголовком, навигацией, избранным контентом.
![Скриншот приборной панели](/docs/4.0/examples/screenshots/dashboard.png)
Приборная доска
Базовая оболочка панели администратора с фиксированной боковой панелью и панелью навигации.
![Скриншот входа](/docs/4.0/examples/screenshots/sign-in.png)
Войти
Пользовательский макет формы и дизайн для простой формы входа.
![Закрепленный скриншот нижнего колонтитула](/docs/4.0/examples/screenshots/sticky-footer.png)
Липкий нижний колонтитул
Прикрепите нижний колонтитул к нижней части окна просмотра, если содержимое страницы короткое.
![Скриншот липкой панели навигации нижнего колонтитула](/docs/4.0/examples/screenshots/sticky-footer-navbar.png)
Липкая панель навигации нижнего колонтитула
Прикрепите нижний колонтитул к нижней части окна просмотра с фиксированной верхней панелью навигации.
Примеры, посвященные реализации использования встроенных компонентов, предоставляемых Bootstrap.
![Скриншот стартового шаблона](/docs/4.0/examples/screenshots/starter-template.png)
Стартовый шаблон
Ничего, кроме основ: скомпилированные CSS и JavaScript.
![Скриншот сетки](/docs/4.0/examples/screenshots/grid.png)
Сетка
Несколько примеров макетов сетки со всеми четырьмя уровнями, вложением и т. д.
![Скриншот Джамботрона](/docs/4.0/examples/screenshots/jumbotron.png)
Джамботрон
Создайте вокруг джамботрона панель навигации и несколько основных столбцов сетки.
Взяв компонент панели навигации по умолчанию и показав, как его можно перемещать, размещать и расширять.
![Скриншот панели навигации](/docs/4.0/examples/screenshots/navbars.png)
Навбары
Демонстрация всех адаптивных и контейнерных опций для панели навигации.
![Статический скриншот панели навигации](/docs/4.0/examples/screenshots/navbar-static.png)
Статическая панель навигации
Одиночный пример статической верхней панели навигации вместе с некоторым дополнительным содержимым.
![Исправлен скриншот навбара](/docs/4.0/examples/screenshots/navbar-fixed.png)
Навбар исправлен
Пример одной панели навигации с фиксированной верхней панелью навигации вместе с некоторым дополнительным содержимым.
![Нижний скриншот панели навигации](/docs/4.0/examples/screenshots/navbar-bottom.png)
Нижняя панель навигации
Пример одной панели навигации с нижней панелью навигации и некоторым дополнительным содержимым.
Примеры, которые фокусируются на перспективных функциях или методах.
![Скриншот с плавающими метками](/docs/4.0/examples/screenshots/floating-labels.png)
Плавающие этикетки
Красивые простые формы с плавающими метками над вашими входными данными.
![Скриншот вне холста](/docs/4.0/examples/screenshots/offcanvas.png)
Offcanvas
Превратите расширяемую панель навигации в скользящее меню вне холста.