実例v4.4.1v3.4.1拡張アプローチアイコン概要レスポンシブクラスz-indexスケールコンポーネント要素オーバーレイ要素JS上のHTMLとCSSユーティリティフレキシブルHTMLトップに戻る拡張アプローチBootstrap4.xの使い方をBootstrap3.xからの変更箇所を交えて解説しています。アプローチ(Approach)Bootstrapの構築と保守に使用される基本原則、戦略、テクニックについて学習し、より簡単にカスタマイズして拡張できるようにする。導入のページにはプロジェクトの紹介ツアーとその紹介があるが、ここではBootstrapで何をするのかについて焦点を当てる。それは、他の人がBootstrapから学習し、共に貢献し、改善を助けるために、ウェブ上に構築するBootstrapの概念を説明。Bootstrapは話し合いが大好き(但し英語)。概要(Summary)ここではBootstrapのアプローチをどのように解説するのか深く掘り下げてみる。コンポーネントはレスポンシブ対応とモバイルファーストでなければならないコンポーネントは基本クラスで構築し、修飾子クラスを使って拡張する必要があるコンポーネントの状態は、共通のZ-indexスケールに従う必要がある可能な限りJavaScriptよりもHTMLとCSSの実装が好ましい可能な限りカスタムスタイルよりもユーティリティを使用する可能な限り厳密なHTML要件(子セレクタ)を強制しないようにレスポンシブ(Responsive)Bootstrapのレスポンシブスタイルは、レスポンシブ性が高くなるように構築されている。これは、しばしばモバイルファーストと呼ばれている。Bootstrapの解説では、そのほとんどに対応するが、時にはそれが大まかな可能性もある。すべてのコンポーネントがBootstrapで完全にレスポンシブするわけではないが、このレスポンスアプローチは、ビューポートが大きくなるにつれてスタイルを追加するように促すことで、CSSの上書きを減らすのが目的。Bootstrap全体ではメディアクエリで最も明確にわかります。ほとんどの場合、特定のブレークポイントに適用され始め、より高いブレークポイントまで実行される最小幅のクエリを使用。中程度のブレークポイント以降に適用される。時には、これらの上書きは、コンポーネントのコア機能を書き換えるより機能的にも精神的にも明確に実装やサポート可能。Bootstrapではこのアプローチを制限するよう努めているが、それでも時々使用することがある。クラス(Classes)ブラウザ間の正規化スタイルシートであるRebootを除き、すべてのスタイルはクラスをセレクタとして使用することを目指している。.child)の操作が簡単すぎて簡単に上書きできないようにすることを意味している。そのためコンポーネントは、上書きされない共通のプロパティと値の組合せを格納する基本クラスを使用して構築する必要がある。.btn-primary。修飾子クラスは、複数のバリアントにわたって複数のプロパティまたは値を変更する必要がある場合にのみ使用する。修飾子は必ずしも必要なわけではないので、コードの行を実際に保存していて、作成時に不要な上書きを防ぐ必要がある。修飾子の良い例は、テーマカラークラスとサイズバリエーション。プロパティを変更せずに二重の境界線を防止するため、要素が重なり合うよう構築されている。