Шаблон bootstrap html: 4692+ Шаблонов для Bootstrap | BootstrapТема

Leave a Comment / Html / By /

Шаблоны. Документация Bootstrap 3.3.2

Базовый шаблон, основные шаблоны и примеры.

Начните с базового HTML шаблона или используйте эти примеры. Мы надеемся, что разработчики будут использовать эти шаблоны в качестве примера, а не как конечный результат.

Приведеный ниже HTML-код использует минимизированную версию Bootstrap.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.
 
 maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h2>Привет, мир!</h2>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

Дополнительные шаблоны созданы на основе базового, представленного разделом выше. Также рекомендуем посмотреть советы по Настройке Bootstrap для использования вашего собственного варианта.

Использование CSS

Базовый шаблон

Ничего лишнего, кроме основного: CSS, JavaScript и использован контейнер.

Разметка

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

Jumbotron

Основу макета составляет большой экран Jumbotron и базовая система разметки. В панель навигации включены поля формы.

Узкий Jumbotron

Большой экран Jumbotron на основе узкого контейнера. В качестве навигации используются навигационные табы.

Панель навигации

Навигационное меню

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

Статическое меню

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

Фиксированное меню

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

Базовое применение Bootstrap

Тема Bootstrap

Основная тема Bootstrap-3 с популярными элементами визуального оформления.

Блог

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

Обложка

Одностраничный шаблон, растянутый на весь экран, для построения простых и красивых сайтов.

Слайдер

В слайдере можно использовать изображения и текст. В контенте страницы добавлены некоторые новые компоненты.

Выровненное меню

Панель навигации с выровненными по ширине ссылками меню. Внимание! Не очень дружит с WebKit.

Панель администратора

Шаблон базовой структуры панели администратора с фиксированным боковым меню и панелью навигации.

Страница входа на сайт

Простой шаблон страницы входа на сайт.

Прижатый футер

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

Прижатый футер с меню

Прижатый футер отображается в нижней части страницы, когда содержимое окна слишком короткое. Панель навигации в верхней части.

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

Неадаптивный Bootstrap

Как отключить адаптивную разметку в Bootstrap читайте в разделе Блокировка адаптивности в Bootstrap.

Отключение меню

Создание навигационного меню с возможностью его отключения при малом разрешении экрана.

Пять бесплатных Bootstrap-шаблонов для сайта клининговой компании

Если вы работаете в сфере уборки и клининга и хотите продвигать свой клининговый бизнес, вам нужен профессиональный сайт. Предлагаем 5 бесплатных HTML-шаблонов, с которыми вы можете быстро создать веб-сайт клининговой компании, службы уборки или сайт персональных услуг по уборке помещений.

Clenora

Clenora — многостраничный HTML-шаблон с использованием фреймворка Bootstrap 5. Шаблон на 100% адаптивен и удобен для мобильных устройств.

Архив включает в себя 7 страниц: домашняя страница, общая страница услуг, целевая страница услуги, страница о нас, страница контактов, общая и целевая страницы блога. На сайте есть всё необходимое для запуска: описание услуг, цены, команда, партнёры, карусели фотографий, панель вопросов-ответов, отзывы, карта Гугла, форма заказа, форма обратной связи и пр.

Демо | Скачать

CleanMe

CleanMe — многостраничный HTML-шаблон на Bootstrap 4 с адаптивной и кросс-браузерной вёрсткой.

В архиве 6 страниц: главная, о нас, услуги, проект, блог, контакты. Шаблон имеет выпадающее меню, форму обратной связи, раздел часто задаваемых вопросов, галерею работ с фильтром, блок с ценами, шкалу для отображения истории компании, фото сотрудников, кнопки социальных сетей, карусель отзывов, форму заявки и др.

Демо | Скачать

Cleaning Company

Cleaning Company — бесплатный многостраничный шаблон на Bootstrap 4 с чистым и минималистичным дизайном. Сайт полностью адаптивен и оптимизирован для всех основных браузеров.

В архиве 8 страниц: главная, о компании, услуги, портфолио, стоимость, контакты, общая и целевая страницы блога.

Шаблон имеет продуманную структуру, описание услуг и преимуществ фирмы, карту Google, форму обратной связи и подписки на новости, раздел часто задаваемых вопросов, галерею работ с фильтром, модальный видеоплеер, таблицу с ценами, счётчики с показателями компании, кнопки социальных сетей, фото сотрудников, форму заявки, карусель отзывов и т.  п..

Демо | Скачать

Chillclean

Chillclean — многостраничный HTML-шаблон на Bootstrap 4. Адаптивная и кроссбраузерная вёрстка, jQuery, HTML5 и CSS3.

В архиве шаблона более 30 готовых страниц — от главной страницы и магазина товаров до страницы регистрации и 404 ошибки.

Фиксированное меню, слайдеры, фотогалереи с фильтрами, счётчики, кнопки соцсетей, формы обратной связи, отзывы, css-аккордеон с вопросами-ответами, теги и многое другое.

Демо | Скачать

Laundry

Многостраничный Bootstrap-шаблон Laundry подойдёт для прачечной или клининговой компании. Сайт построен с использованием HTML5, CSS3, jQuery и Bootstrap 4. На 100% отзывчив, хорошо продуман и совместим с большинством браузеров, экранов Retina и устройств.

В архиве 6 HTML-страниц: главная, о компании, услуги, контакты, общая и целевая страницы блога. Есть документация, страница с кодом блоков и элементов дизайна.

Кроме того, шаблон включает в себя несколько удобных функций: липкая верхняя панель навигации, кнопка призыва к действию, карусель отзывов, счётчики фактов, Google Maps, кнопку возврата наверх, форму подписки на рассылку, комментарии, контактную форму и многое другое.

Демо | Скачать

Шаблон блога для Bootstrap

Пример сообщения в блоге

1 января 2014 г., автор: Mark

В этом сообщении блога показано несколько различных типов содержимого, которые поддерживаются и оформляются с помощью Bootstrap. Поддерживается базовая типографика, изображения и код.

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Энейский eu leo ​​quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum.

Curabitur blandit tempus porttitor. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam id dolor id nibh ultricies vehicula ut id elit.

Etiam porta sem malesuada magna mollis euismod. Cras mattis consectetur purus sit amet fermentum. Энейская lacinia bibendum nulla sed consectetur.

Заголовок

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Morbi leo risus, porta ac consectetur ac, вестибюль и эрос.

Субпозиция

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

 Пример блока кода

Aenean lacinia bibendum nullased consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.

Субпозиция

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Энейская lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

  • Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
  • Donec id elit non mi porta gravida at eget metus.
  • Nulla vitae elit libero, фаретра augue.

Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue.

  1. Vestibulum id ligula porta felis euismod semper.
  2. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
  3. Меценат sed diam eget risus varius blandit sit amet non magna.

Cras mattis consectetur purus sit amet fermentum. Sed posuere consectetur est at lobortis.

Еще одно сообщение в блоге

23 декабря 2013 г., автор Jacob

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Энейский eu leo ​​quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum.

Curabitur blandit tempus porttitor. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam id dolor id nibh ultricies vehicula ut id elit.

Etiam porta sem malesuada magna mollis euismod. Cras mattis consectetur purus sit amet fermentum. Энейская lacinia bibendum nulla sed consectetur.

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Morbi leo risus, porta ac consectetur ac, вестибюль и эрос.

Новая функция

14 декабря 2013 г., Chris

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Энейская lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

  • Praesent commodo cursus magna, vel scelerisque nisl consectetur et.
  • Donec id elit non mi porta gravida at eget metus.
  • Nulla vitae elit libero, фаретра augue.

Etiam porta sem malesuada magna mollis euismod. Cras mattis consectetur purus sit amet fermentum. Энейская lacinia bibendum nulla sed consectetur.

Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue.

Agency — одностраничная тема Bootstrap

Agency

Чистая, стильная одностраничная тема Bootstrap для портфолио, идеально подходящая для вашего агентства или малого бизнеса

Launch Live Preview

Live PreviewView Исходный код

Чистая, стильная одностраничная тема портфолио Bootstrap, идеально подходящая для вашего агентства или малого бизнеса XXXX

Последнее обновление

X XXXX назад

Версия продукта

X.X.X

Версия Bootstrap

X.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *