Весь мир разработчиков сайтов кипит — вышла новая версия знаменитого css framework Tweeter Bootstrap 3. Эта версия готовилась почти 9 месяцев и был полностью переработан весь фреймворк.
В версии 3 довольно много изменений. Я уже поигрался с ним на локальной машине и в принципе мне понравилось.
Самое главное изменение в том, что теперь Bootstpap 3 — самостоятельный OpenSource продукт и не имеет отношения к Tweeter. Разработчики создали отдельную компанию и отдельный сайт.
Bootstrap 3 стал меньше весить из-за того, что разработчики решили упростить базовое оформление в сторону модного плоского дизайна. С одной стороны это хорошо, с другой не всем понравился новый внешний вид. Однако для любителей старого вида можно скачать тему, которая приведет к внешнему виду, привычного по ветке 2.
Заодно убрали поддержку старых браузеров: Microsoft Internet Explorer 7 и Mozilla Firefox 3.6. Давно пора.
Сетка в Bootstrap 3
Глобальное изменение произошло с сеткой. Теперь все шаблоны будут адаптивными по умолчанию, а для того, чтобы отключить эту адаптивность, придется делать некоторые телодвижения. Кроме того, классы spanN заменили на 4 разных классов, которые будут работать в зависимости от ширины экрана: col-xs-*, col-sm-*, col-md-*, col-lg-*. Вместо звездочки нужно подставить цифру от 1 до 12. Суффикс xs предназначен для телефонов с разрешением до 768 пикселя (ширина контейнера будет авто), sm — для планшетов до 992 (ширина контейнера будет 750 пикселя), md — для десктопа (ширина 970 пикселя) и lg — для больших машин (ширина 1170 пикселя).
Блочная модель претерпела изменения — везде используется box-sizing: border-box. Так что для подключения bootstrap 3 к старым проектам просто не получится. Придется основательно работать руками и головой, поскольку все разлезется и вам не удастся просто заменить классы ячеек на новые (пробовал уже лично).
Очень жаль, что не сделали на выбор более мелкие сетки, а то часто хотелось бы более мелкие внутренние разбивки элементов по дизайну. Ну и ладно, придется делать руками.
Javascript в Bootstrap 3
Плагины для Bootstrap 3 были переписаны, сильно улучшена производительность. Вроде обещали исправить косяки со слайдером, но я еще не потестил лично.
Иконки
Если в старой версии был спрайт с 40 иконками, то сейчас подключен целый шрифт Glyphicons, который вроде платный, но для Bootstrap 3 сделали бесплатным. Изменили и классы для иконок: glyphicon и glyphicon-Название_иконки. Старый стиль мне больше нравился. Ну да ладно, буду подключать шрифт Font Awesome, тем более что есть специальные онлайн сервисы, которые дают возможность скачать кастомизированный шрифт только с нужными иконками, например этот — fontello.com.
Элементы оформления
В новой версии улучшили и панели навигации, улучшили отображение типографики, таблиц. Тут можно долго рассказывать, лучше самостоятельно посмотреть.
Кстати, сайт с бесплатными темами https://bootswatch.com/ уже обновил свои темы под последнюю версию bootstrap, старые темы пока доступны в архиве.
