Что такое Bootstrap?

Twitter Bootstrap это замечательный фреймворк для создания современных, кросс-браузерных и стандартизованных интерфейсов. Продуманная структура кода HTML, JavaScript и CSS дает вам возможность создавать множество самых разнообразных элементов интерфейса и сетку сайта.

Свидетельством того, что Bootstrap это очень удачная разработка, является его непрерывно растущая популярность. Нынешний уровень развития этого фреймворка уже позволяет полностью создать любой web-интерфейс. Именно поэтому мы недавно презентовали полностью адаптивные шаблоны Bootstrap. Давайте подробнее разберемся, что же представляет собой Bootstrap с точки зрения разработчика и какие возможности дает. Для

Bootstrap использует новейшие возможности HTML и CSS. Они могут не поддерживаться старыми версиями браузеров. В первую очередь будьте осторожны с IE7 и 8. Начиная с версии Bootstrap 2 все макеты создаваемые с его помощью стали адаптивными.

Основным преимуществом использования Bootstrap является Less – динамический язык стилей, существенно расширяющий возможности CSS. С его помощью разработчики могут создавать переменные, вложенные колонки, управлять цветами и т.д. Так же Less очень легко пользоваться. Достаточно просто вставить код в страницы.

Основные инструменты Bootstrap:

  • Сетки — заранее заданные размеры колонок, которые можно сразу же использовать, например ширина колонки 90px относится к классу .span2, который мы можем использовать в CSS описании документа;
  • Шаблоны — фиксированный или резиновый шаблон документа;
  • Типографика — описания шрифтов, определение некоторых классов для шрифтов таких как код, цитаты и т.п.;
  • Медиа — представляет возможности управления изображениями и видео;
  • Таблицы — средства оформления таблиц, вплоть до добавления функциональности для обеспечения возможности сортировки;
  • Формы — классы для оформления не только форм, но и некоторых событий происходящих с ними;
  • Навигация — классы оформления для вкладок, страниц, меню и панелей инструментов;
  • Алерты — оформление диалоговых окон, подсказок и всплывающих окон.

Вы можете ознакомиться со всеми возможностями Bootstrap на русском.

Сайты на Bootstrap

* * *

* * *

Шаблоны Bootstrap

* * *

* * *

* * *

Для того, что бы оценить все возможности Bootstrap в шаблонах от TemplateMonster вы можете скачать бесплатный пример такого шаблона.

6 комментариев

  1. Гергий

    Twitter Bootstrap – это неправильное название фреймворка. Вот подтверждение с официального сайта http://getbootstrap.com/about/#brand
    Ссылка в конце на документацию по-русски – битая.
    Документация Bootstrap 3 на русском языке постоянно обновляется на сайте http://bootstrap-3.ru/
    Спасибо сайту TemplateMonster за шаблоны на Bootstrap!!!

  2. Где в рунете лучше всего освещены уроки по Bootstrap?

    • Vladimir

      Где в рунете лучше всего освещены уроки по Bootstrap?
      —курсы edX ‘Inroduction to Bootstrap – a tuturial’

  3. Данная версия Bootstrap разработана с нуля и в первую очередь с ориентиром на мобильные девайсы. Сетка здесь построена таким образом, чтобы вы сначала смогли подгонять сайт под маленькие экраны, а уже потом увеличивали размеры.

  4. alex

    как здорово, теперь я смогу делать таблицы в 90px и задавать цвета и шрифты, как же я раньше жил без будструп?

  5. Он изначально создавался под мобильные устройства, заходы на сайты с которых становятся все более частыми. Сетка нового фреймворка разработана так, чтобы вы сперва подгоняли дизайн под маленькие экраны, а уже потом масштабировали его под более широкоформатные устройства.

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

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

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>