Вышел новый бутстрап 5, и в нем было так много изменений. Мы подробно обсудим эти изменения в bootstrap 5 здесь и их важность.
Bootstrap — это самый популярный интерфейсный фреймворк, созданный для разработки современных, адаптивных и динамических интерфейсов для веб-страниц профессионального дизайна. Bootstrap 5 alpha — это последняя версия, и мы все еще ждем стабильной версии. Он был официально выпущен 16 июня 2020 года.
Bootstrap 5 основных изменений
Новый внешний вид для начальной загрузки 5
Новая версия начальной загрузки имеет новый внешний вид. Они улучшили свой документ v4.5.0. Страницы документов Bootstrap больше не имеют полной ширины, это помогает улучшить читаемость и позволяет чувствовать себя более похожим на контент. Боковая панель также была улучшена за счет расширяемого раздела начальной загрузки, чтобы обеспечить более быструю навигацию. Также представлен новый логотип, который представляет собой полужирную букву B с фигурными скобками.
Bootstrap 5 без jQuery
jQuery теряет свою популярность, так как большинство этих современных фреймворков работают через виртуальный DOM, а не напрямую в DOM, что приводит к гораздо более высокой производительности и скорости загрузки. Bootstrap использует jQuery уже 8 лет и убедился, что гораздо проще и эффективнее отказаться от этой технологии в пользу лучшей. Теперь bootstrap 5 сменился на venilla JavaScript, который гораздо более популярен.
Отказ от Internet Explorer и использование дополнительных свойств CSS
Благодаря тому, что начальная загрузка отказалась от использования Internet Explorer, они смогли использовать множество пользовательских свойств CSS. Это позволяет разработчику больше сосредоточиться на разработке желаемой веб-страницы, не беспокоясь о поддержке старых браузеров или о большем размере проекта.
Усовершенствованная система гирлянд
Мы уже можем видеть столбец с 12 столбцами в версии 4 начальной загрузки. В bootstrap 5 он поставляется с сеткой xxl, которая предназначена для экранов шириной более 1400 пикселей. Также классы Gutter были заменены утилитами g- , очень похожими на утилиты margin/padding. ‘gx-’ или ‘gy-*’ можно использовать, чтобы иметь пространство между столбцами и строками. Кроме того, по умолчанию столбцы больше не имеют «позиция: относительная».
Вы можете узнать больше о начальной загрузке GitHub здесь.
Новая библиотека значков SVG
Bootstrap 5 поставляется с потрясающими иконками SVG, которых нет в других версиях. Прежде чем появится стабильная версия, теперь вы можете использовать значки SVG для своего проекта без необходимости проверять значки в Google.
Служебный API
Утилита стала способом создания приложений и веб-сайтов. Bootstrap решил включить эти функции в новую версию bootstrap 5, представив версию утилиты API. Это шаг вперед по сравнению с предыдущим бутстрапом 4, в котором были представлены глобальные классы $enable-*. Эта новая утилита API позволит создать вашу собственную утилиту, когда вы захотите, и при этом иметь возможность удалять или настраивать имеющиеся.
Обновленный документ
Bootstrap перешли со своего обычного статического сайта документации Jekyll на Hugo. Bootstrap внес эти изменения из-за медленной работы Jekyll и необходимости загрузки ruby. У Hugo нет ни одной из этих проблем, и это ускоряет загрузку веб-сайта.
Заключение
Ожидается, что Bootstrap выпустит улучшенные функции в своей стабильной версии и предоставит разработчикам легкий доступ к инструментам, необходимым для того, чтобы сделать вашу работу более удобной для художников и мобильных устройств.
Создавайте потрясающие веб-сайты и веб-приложения
Попытка создать все пользовательские интерфейсы и компоненты для вашего веб-сайта или веб-приложения с нуля может стать очень утомительной задачей. Огромная причина, по которой мы создали Contrast Bootstrap, чтобы помочь сократить количество времени, которое мы тратим на это, чтобы мы могли сосредоточиться на создании некоторых других аспектов проекта. Contrast Bootstrap PRO состоит из набора пользовательского интерфейса с более чем 10000 вариантов компонентов. Вместе с шаблоном из 5 панелей администратора и 23+ дополнительных шаблонов многоцелевых страниц можно создать практически любой тип веб-сайта или веб-приложения. Вы можете просмотреть демонстрацию и узнать больше о Contrast, нажав здесь.
Contrast Bootstrap PRO был построен с использованием самого популярного CSS.
framework Bootstrap, чтобы помочь создать ваш следующий лендинг, администрировать SAAS, предварительный запуск и т. д., проект с чистым, предварительно созданным и хорошо документированным шаблоном и компонентами пользовательского интерфейса. Узнать больше о Контраст.
## Ресурсы
Вам могут пригодиться следующие ресурсы:
Все, что вам нужно знать о Bootstrap 5
Как создать красивую таблицу данных Bootstrap с иконками
Как создать красивую панель навигации с помощью Bootstrap 5.
Как реализовать индикатор выполнения шага React с помощью Tailwind CSS.
Как реализовать темный режим в React с помощью Tailwind CSS.
Как создавать вкладки React с помощью Tailwind CSS.
Первоначально опубликовано на https://www.devwares.com.
