カスタマイズ

概要

Bootstrapをカスタマイズする方法は複数あります。最適な方法は、プロジェクト、ビルドツールの複雑さ、使用しているBootstrapのバージョン、ブラウザのサポートなどによって異なります。

推奨される2つの方法は次のとおりです。

1. ソースファイルを使用および拡張できるように、パッケージマネージャーを介してBootstrapを使用する。
2. Bootstrapのコンパイル済み配布ファイルまたはjsDelivrを使用して、Bootstrapのスタイルに追加またはオーバーライドできるようにする。

すべてのパッケージマネージャーの使用方法の詳細については説明できませんが、独自のSassコンパイラーでBootstrapを使用する方法についてガイダンスを提供できます。

配布ファイルを使用したい場合は、それらのファイルを含める方法とHTMLページの例について、はじめにページを確認してください。 そこから、使用したいレイアウト、コンポーネント、および動作のドキュメントを参照してください。

Bootstrapに慣れてきたら、グローバルオプションの利用方法、カラーシステムの利用と変更、コンポーネントの構築方法、増え続けるCSSカスタムプロパティの使用方法、およびBootstrapで構築する際にコードを最適化する方法の詳細について、このセクションを引き続き探索してください。

CSPsと埋め込みSVG

一部のBootstrapコンポーネントには、ブラウザやデバイス間でコンポーネントのスタイルを統一して簡単に設定するために、CSSに埋め込みSVGが含まれています。より厳格なCSP構成を持つ組織の場合、オプションをより詳細に確認できるように、埋め込みSVG（すべてbackground-imageを介して適用されます）のすべてのインスタンスを文書化しました。

• アコーディオン
• カルーセルコントロール
• 閉じるボタン（アラートとモーダルで使用）
• フォームチェックボックスとラジオボタン
• フォームスイッチ
• フォームの検証アイコン
• ナビゲーションバーの切り替えボタン
• セレクトメニュー

コミュニティの会話に基づいて、独自のコードベースでこれに対処するためのいくつかのオプションには、URLをローカルでホストされるアセットに置き換える、画像を削除してインライン画像を使用する（すべてのコンポーネントでは不可能）、およびCSPを変更することが含まれます。推奨事項は、独自のセキュリティポリシーを注意深く見直し、必要に応じて最適な方法を決定することです。