Настройка
Узнайте, как темизировать, настраивать и расширять Bootstrap с помощью Sass, множества глобальных опций, обширной цветовой системы и многого другого.
Обзор
Существует несколько способов настройки Bootstrap. Ваш лучший путь может зависеть от вашего проекта, сложности ваших инструментов сборки, версии Bootstrap, которую вы используете, поддержки браузеров и многого другого.
Наши два предпочтительных метода:
- Использование Bootstrap через менеджер пакетов, чтобы вы могли использовать и расширять наши исходные файлы.
- Использование скомпилированных файлов дистрибуции Bootstrap или jsDelivr, чтобы вы могли добавлять или переопределять стили Bootstrap.
Хотя мы не можем вдаваться в подробности о том, как использовать каждый менеджер пакетов, мы можем дать некоторые рекомендации по использованию Bootstrap с вашим собственным компилятором Sass.
Для тех, кто хочет использовать файлы дистрибуции, ознакомьтесь со страницей начала работы о том, как включить эти файлы и пример HTML страницы. Оттуда обратитесь к документации по макету, компонентам и поведению, которые вы хотите использовать.
По мере знакомства с Bootstrap продолжайте изучать этот раздел для получения более подробной информации о том, как использовать наши глобальные опции, использовать и изменять нашу цветовую систему, как мы строим наши компоненты, как использовать наш растущий список пользовательских свойств CSS и как оптимизировать ваш код при создании с Bootstrap.
CSP и встроенные SVG
Несколько компонентов Bootstrap включают встроенные SVG в наш CSS для стилизации компонентов последовательно и легко в различных браузерах и устройствах. Для организаций с более строгими конфигурациями CSP мы задокументировали все случаи наших встроенных SVG (все из которых применяются через background-image), чтобы вы могли более тщательно рассмотреть ваши варианты.
- Аккордеон
- Элементы управления каруселью
- Кнопка закрытия (используется в предупреждениях и модальных окнах)
- Флажки и переключатели форм
- Переключатели форм
- Иконки валидации форм
- Кнопки переключения навигационной панели
- Меню выбора
На основе обсуждения в сообществе, некоторые варианты решения этой проблемы в вашей собственной кодовой базе включают замену URL-адресов локально размещенными ресурсами, удаление изображений и использование встроенных изображений (не возможно во всех компонентах), и модификацию вашего CSP. Наша рекомендация — внимательно изучить ваши собственные политики безопасности и решить о наилучшем пути вперед, если это необходимо.