Добрый день.
Речь сегодня пойдёт о современном решении для построения шаблонов - фреймворке Bootstrap.
Bootstrap — фреймворк, набор HTML+CSS инструментов и шаблонов для верстки и более эффективного и быстрого создания веб-ресурсов.
Когда он появился?
Bootstrap появился в августе 2011 года, его создателями стали Марк Отто и Джейкоб Торнтон. На данный момент существует несколько версий фреймворка:
1 - совсем сырая и достаточно пустая по сравнению конечно же с последними. Ни сетки, ни адаптивности. Вообщем грустно, но на тот момент это было круто! Вышла 19 августа 2011 года.
2 - уже не плохо, но далека от идеала. Но уже вторая версия начала активно применяться разработчиками. Основными нововведениями её стали: колоночная сетка (12 колонок) и адаптивность! Вышла 31 января 2012 года.
3 - самая по моему мнению лучшая и стабильная на данный момент версия. Всё что нужно и всё, что хотите там есть. На базе этой версии создано просто огромное количество сайтов и просто дизайнов. Вышла 19 августа 2013 года
4 - достаточно сыроватая, по функционалу не особо отличается от 3-ей. Вышла 18 января 2018 года вышла первая стабильная версия.
Основные инструменты Bootstrap
- Сетки — заранее заданные размеры колонок, которые можно сразу же использовать, например ширина колонки 140 px относится к классу .span2 (.col-md-2 в третьей версии фреймворка), который можно использовать в CSS-описании документа.
- Адаптивность — фиксированный или резиновый шаблон документа.
- Типография — описания шрифтов, определение некоторых классов для шрифтов, таких как код, цитаты и т. п.
- Медиа — представляет некоторое управление изображениями и видео.
- Таблицы — средства оформления таблиц, вплоть до добавления функциональности сортировки.
- Формы — классы для оформления форм и некоторых событий, происходящих с ними.
- Навигация — классы оформления для табов, вкладок, страничности, меню и панели инструментов.
- Уведомления — оформление диалоговых окон, подсказок и всплывающих окон.
Мнение автора
Данный фреймворк абсолютно удобен. Построение элементов дизайна сократилось в разы, собственный код нужен уже больше только для стилизации определённых элементов, так как всю основу Bootstrap берёт на себя.
Удобно? Безусловно. Ты оперируешь уже с готовыми элементами и не нужно в большинстве случаев "ломать голову", над придумыванием, как реализовать тот или иной момент.
Уникальный дизайн получится создать? А почему нет! Фреймворк даёт основу которую можно переделать при надобности абсолютно, так как нужно.
Можно ли найти в интернете примеры? Их просто очень много! В интернете полно готовых вариантов целых дизайнов, за которые авторы даже денег не просят порой, так в интернете можно найти полно мелких вариантов элементов - от модальных окон различного вида, то простейших таблиц.
Собственно данная статья несёт вводную часть про данный фреймворк. Дальше мы будем углубляться постепенно и разбирать элементы данного фреймворка.