BinaryDevelop
  1. ホーム
  2. twitter-bootstrap

[解決済み] Twitter Bootstrapでcontainerとrowはいつ使うべきですか？

2023-06-02 02:36:39

質問

以下のクラスはどのような場合に使用するのでしょうか？ container と row . この部分については、Bootstrapのドキュメントがかなり曖昧なので、よくわかりません。

Bootstrap3を使っています。

どのように解決するのですか？

container は、コンテナである row 要素で構成されています。

row 要素は列のコンテナです（docsはグリッドシステムと呼んでいます）。

また container は、レイアウトのレスポンシブ動作に対応したコンテンツの余白を設定します。

このように container クラスは、Bootstrap プロジェクトのスタイルガイドラインに基づいた「ボックス型」のコンテンツを作成するためによく使用されます。

もしあなたが全幅のグリッドを作りたいのであれば、 要素のみを使用することができます (通常の合計 12cols にまたがります)。

は row と container クラスは、body内の要素用です。 ですから、基本的なレイアウトは次のようになります。 

row

ボックス型のレスポンシブレイアウトの場合。

を省略した場合 <html> <body> <div class="container"> <div class="row"> <div class="col-md-xx"></div> ... </div> <div class="row"> <div class="col-md-xx"></div> ... </div> </div> </body> </html> を省略すると、全角のレイアウトになります。

ジャンボトロンの例

ジャンボトロンは container の動作の良い例です。もし、ジャンボトロン要素を container 要素内に置いた場合、ジャンボトロンは丸みを帯びたボーダーを持ち、レスポンシブ幅に基づいた固定幅になります。 ジャンボトロンがコンテナの外にある場合は、ボーダーなしで全幅に広がります。

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します