Что такое Bootstrap?

Многие которые занимаются версткой не раз слышали слово bootstrap, и всех наверное заинтересовало что же это такое. В этой не большой статье мы постараемся ответить на этот вопрос четко и понятно и без лишней теории.

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

И так основные плюсы Bootstrap это:

1. Легкость и быстрота при создании шаблонов или сайтов с нуля
2. Легкость при создании адаптивных сайтов или шаблонов
3. Множество дополнительных библиотек для подключения
4. Готовые css файлы

Это основные плюсы Bootstrap-а которые нам нужны, конечно есть и мелкие вещи которые вы сами усвоите при личном знакомстве с Bootstrap-ом.

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

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

Скачать Bootsrap можно с официального сайта или любых других сайтов к примеру отсюда. На момент написания статьи последняя версия была Bootsrap v3.3.1.

Существенной разницы между ними в техническом плане нету, только в плане интерфейса. На 3 версии Bootsrap-а кнопки оформлены без градиента и так далее, вы в любой момент можете перейти на третью версию, но перед этим обязательно сделайте резервную копию сайта.

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

Файловая структура Bootsrap

bootstrap/
  ├── css/
  │   ├── bootstrap.css
  │   ├── bootstrap.min.css
  ├── js/
  │   ├── bootstrap.js
  │   ├── bootstrap.min.js
  ├── img/
  │   ├── glyphicons-halflings.png
  │   ├── glyphicons-halflings-white.png
  └── README.md

Это основной вид Bootstrap’а: скомпилированные файлы для начала быстрой работы, просто загрузите на сервер и Вы готовы к работе. Мы предоставили скомпилированные CSS и JS (bootstrap.*), наряду со скомпилированными и минифицированными CSS и JS (bootstrap.min.*) файлами. Картинки были сжаты через ImageOptim, приложение для Mac, позволяющее сжимать PNG-файлы.

Учитывайте что все JavaScript-плагины основаны на jQuery.

Остальную информацию вы можете прочесть на сайте самого Bootsrap-a. Спасибо за внимание.