[解決済み] Bootstrapコンテナが複数またはネストされていませんか?
2022-02-10 17:34:33
質問
私の
理解度
は、Bootstrap スタイルの要素はすべて
<div class="container">
要素を使用します。しかし、Bootstrapの例では、複数の"containers"があるのを時々見かけます。
<div class="container">
<!-- Blah, GUI stuff, blah -->
</div>
...
<div class="container">
<!-- Blah, more GUI stuff, blah -->
</div>
私の質問です。
- 1つのHTMLページに複数の"container divs"が必要になるのはどんな場合でしょうか?本文全体を1つの大きなコンテナdiv"に入れるのと比べて、どんな利点があるのでしょうか?
- コンテナDivを他のDivの中に入れ子にしたいことはありますか?いつ、何のために?
どのように解決するのですか?
-
ページの一部がビューポートの幅いっぱいに表示され、他の部分は表示されない。背景は全幅になりますが、コンテンツは全幅にならないものもあります。
たとえば、特集ページでは、背景画像や背景色をビューポートの幅いっぱいに設定していますが、その中のコンテンツ(フォームなど)は、ビューポートの幅を超えないよう
.container
は、任意のビューポート幅において -
ネストしない
.container
または.container-fluid
-- を参照してください。 ドキュメント . 必要ありません。Docs: Bootstrapでは、サイトのコンテンツを包むためにcontaining要素が必要です。 とグリッドシステムを格納します。2つのコンテナのうち1つを選択して使用することができます。 を使用します。パディングなどの関係で、どちらも コンテナは入れ子にできません [どちらも .container と .container-fluid は入れ子になってはいけないという意味です]。
関連
-
[解決済み] 特定のdivを右へ移動させたい
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] SCSSとSassの違いは何ですか?
-
[解決済み] Twitter Bootstrapのメニューをクリックではなく、ホバーでドロップダウンさせる方法
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] Bootstrapの列をすべて同じ高さにするにはどうしたらいいですか?
-
[解決済み] Bootstrap3による垂直方向の整列
-
[解決済み] BootstrapのモーダルウィンドウをjQueryで開くには?
-
[解決済み] Bootstrap 3 の sr-only とは何ですか?
-
[解決済み] Twitter Bootstrapでナビバーの色を変更する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] divをクリックすると、その下にある要素に移動します。
-
[解決済み] 2つのdivを隣り合わせに配置するには?
-
[解決済み] CSSで残りの幅を埋める
-
[解決済み] CSSやSVGで半円を描く
-
[解決済み] ChromeでCSSカスタムスタイルのボタンから青枠を削除する
-
[解決済み] Bootstrap 3でnavbar-static-topは何をするのですか?
-
[解決済み] Bootstrapのポップオーバーの幅を変更する
-
[解決済み] ネストしたdivのcssを簡素化
-
[解決済み] モバイル端末でCSSを使用したフルハイトの背景画像
-
[解決済み] CSSでitempropをターゲットにする?