Starters
Webpack、Parcel、Viteなどの一般的なJSフレームワークでBootstrapを使用する実用的な例で、StackBlitzで編集できます。
Sass & JS
npmを使用してBootstrapのSassをAutoprefixerとStylelintでインポートおよびコンパイルし、バンドルされたJavaScriptを含めます。
Sass & ESM JS
BootstrapのSassをAutoprefixerとStylelintでインポートおよびコンパイルし、ESM shimでソースJavaScriptをコンパイルします。
Bootstrap color modes
BootstrapのSassをStylelintでインポートおよびコンパイルし、Bootstrapカラーモードを使用します。
Bootstrap Icons
BootstrapのSassをStylelint、PurgeCSS、およびBootstrap IconsのWebフォントでインポートおよびコンパイルします。
React
React、Next.js、およびReact BootstrapでBootstrapのソースSassとJavaScriptをインポートおよびバンドルします。
Snippets
既存のコンポーネントとユーティリティにカスタムCSSなどを追加して、サイトやアプリを構築するための一般的なパターンです。
Headers
これらのヘッダーコンポーネントでブランディング、ナビゲーション、検索などを表示します
Heroes
明確な行動喚起を特徴とするヒーローで、ホームページのステージを設定します。
Features
マーケティングコンテンツで機能、利点、またはその他の詳細を説明します。
Sidebars
オフキャンバスまたはマルチカラムレイアウトに最適な一般的なナビゲーションパターンです。
Footers
大小を問わず、素晴らしいフッターですべてのページを強力に終了します。
Dropdowns
フィルター、アイコン、カスタムスタイルなどでドロップダウンを強化します。
List groups
ユーティリティとカスタムスタイルを使用してリストグループを拡張し、あらゆるコンテンツに対応します。
Modals
機能ツアーからダイアログまで、あらゆる目的に対応するようにモーダルを変換します。
Badges
カスタム内部HTMLと新しい外観でバッジを機能させます。
Breadcrumbs
カスタムアイコンを統合し、ステッパーコンポーネントを作成します。
Buttons
ユーティリティを使用して、ほぼすべてのユースケースに対応するカスタムボタンを作成します。
Jumbotrons
クラシックなBootstrapコンポーネントの最新バージョンを作成します。
Custom Components
Bootstrapをすばやく開始し、フレームワークへの追加のベストプラクティスを示すための、まったく新しいコンポーネントとテンプレートです。
Album
フォトギャラリー、ポートフォリオなどのシンプルな1ページテンプレートです。
Pricing
カードで構築され、カスタムヘッダーとフッターを備えた価格設定ページの例です。
Checkout
フォームコンポーネントとその検証機能を示すカスタムチェックアウトフォームです。
Product
広範なグリッドと画像作業を備えた、リーンな製品重視のマーケティングページです。
Cover
シンプルで美しいホームページを構築するための1ページテンプレートです。
Carousel
ナビゲーションバーとカルーセルをカスタマイズし、新しいコンポーネントを追加します。
Blog
ヘッダー、ナビゲーション、注目コンテンツを備えた雑誌のようなブログテンプレートです。
Dashboard
固定サイドバーとナビゲーションバーを備えた基本的な管理ダッシュボードシェルです。
Sign-in
シンプルなサインインフォームのカスタムフォームレイアウトとデザインです。
Sticky footer
ページコンテンツが短い場合、フッターをビューポートの下部に固定します。
Sticky footer navbar
固定トップナビゲーションバーでフッターをビューポートの下部に固定します。
Jumbotron
ユーティリティを使用してBootstrap 4のジャンボトロンを再作成および強化します。
Framework
Bootstrapが提供する組み込みコンポーネントの使用実装に焦点を当てた例です。
Starter template
基本のみ: コンパイル済みCSSとJavaScriptです。
Grid
4つのすべての層、ネスト、その他を含むグリッドレイアウトの複数の例です。
Cheatsheet
Bootstrapコンポーネントのキッチンシンクです。
Navbars
デフォルトのナビゲーションバーコンポーネントを使用して、それを移動、配置、拡張する方法を示します。
Navbars
ナビゲーションバーのすべてのレスポンシブおよびコンテナオプションのデモンストレーションです。
Navbars offcanvas
Navbarsの例と同じですが、オフキャンバスコンポーネントを使用しています。
Navbar static
静的トップナビゲーションバーと追加コンテンツを含む単一のナビゲーションバーの例です。
Navbar fixed
固定トップナビゲーションバーと追加コンテンツを含む単一のナビゲーションバーの例です。
Navbar bottom
ボトムナビゲーションバーと追加コンテンツを含む単一のナビゲーションバーの例です。
Offcanvas navbar
拡張可能なナビゲーションバーをスライド式オフキャンバスメニューに変換します（オフキャンバスコンポーネントは使用しません）。
RTL
さまざまなカテゴリから修正されたこれらの例で、BootstrapのRTLバージョンを実際に確認してください。
RTLはまだ実験的な段階であり、フィードバックに基づいて進化していきます。何か気づいた点や改善の提案がありますか？
Album RTL
フォトギャラリー、ポートフォリオなどのシンプルな1ページテンプレートです。
Checkout RTL
フォームコンポーネントとその検証機能を示すカスタムチェックアウトフォームです。
Carousel RTL
ナビゲーションバーとカルーセルをカスタマイズし、新しいコンポーネントを追加します。
Blog RTL
ヘッダー、ナビゲーション、注目コンテンツを備えた雑誌のようなブログテンプレートです。
Dashboard RTL
固定サイドバーとナビゲーションバーを備えた基本的な管理ダッシュボードシェルです。
Cheatsheet RTL
BootstrapコンポーネントのキッチンシンクRTLです。
