Узнайте, как создавать темы, настраивать и расширять Bootstrap с помощью Sass, множества глобальных опций, обширной цветовой системы и многого другого.
Обзор
Есть несколько способов настроить Bootstrap. Ваш лучший путь может зависеть от Вашего проекта, сложности Ваших инструментов сборки, версии Bootstrap, которую Вы используете, поддержки браузера и многого другого.
Два наших предпочтительных метода:
- Использование Bootstrap через менеджер пакетов, чтобы Вы могли использовать и расширять наши исходные файлы.
- Использование скомпилированных файлов дистрибутива Bootstrap или jsDelivr, чтобы Вы могли добавлять или переопределять стили Bootstrap.
Хотя мы не можем здесь подробно описывать, как использовать каждый менеджер пакетов, мы можем дать некоторые рекомендации по использованию Bootstrap с Вашим собственным компилятором Sass.
Для тех, кто хочет использовать файлы распространения, просмотрите страницу начала работы, чтобы узнать, как включить эти файлы и пример HTML-страницы. Оттуда обратитесь к документации по макету, компонентам и поведению, которые Вы хотите использовать.
По мере знакомства с Bootstrap продолжайте изучать этот раздел, чтобы получить более подробную информацию о том, как использовать наши глобальные параметры, использование и изменение нашей цветовой системы, как мы создаем наши компоненты, как использовать наш растущий список настраиваемых свойств CSS и как для оптимизации Вашего кода при сборке с помощью Bootstrap.
CSP и встроенные SVG
Некоторые компоненты Bootstrap включают встроенные SVG-файлы в наш CSS, чтобы согласованно и легко стилизовать компоненты в разных браузерах и на разных устройствах. Для организаций с более строгими конфигурациями CSP, мы задокументировали все экземпляры наших встроенных SVG (все из которых применяются через background-image), поэтому Вы можете более тщательно изучить свои варианты.
- Accordion
- Carousel controls
- Close button (используется в уведомлениях и модальных окнах)
- Form checkboxes and radio buttons
- Form switches
- Form validation icons
- Navbar toggle buttons
- Select menus
На основе обсуждения сообщества, некоторые варианты решения этой проблемы в вашей собственной кодовой базе включают замену URL-адресов локально размещенными ресурсами, удаление изображений и использование встроенных изображений (невозможно во всех компонентах) и изменение вашего CSP. Наша рекомендация - внимательно изучить свои собственные политики безопасности и при необходимости выбрать лучший путь для дальнейшего развития.