5

私が取り組んでいるこのアプリケーションには、Twitterブートストラップを使い始めました。

固定グリッドシステムと流動グリッドシステムの両方での行のネストに関するドキュメントを読みました。

今、私はこのようなことをしたい

ここに画像の説明を入力してください

だからもちろん私はこのようなことをすることができます

<div class="container">
    <div class="row">
        <div class="span 12">red</div>
        <div class="row">
            <div class="span 3">yellow</div>
            <div class="span 9">green</div>
        </div>
    </div>
</div>

そして、私は私が欲しいものを手に入れると思います。しかし、私はすることの結果は何であるか疑問に思っています

<div class="container">
    <div class="row">
        <div class="span 12">red</div>
    </div>
    <div class="row">
        <div class="span 3">yellow</div>
        <div class="span 9">green</div>
    </div>
</div>

containerブラウザに違いは見られませんが、1つのタグに複数の行要素を含めるとどうなるのでしょうか。行のネストは、私が示したようなものを作成するための唯一の適切な方法ですか？私のデザインのこれら2つの実装の違いは、いわば何ですか？

4

1 に答える 1

6

2番目のバージョンの方が正確です。しかし、両方とも機能します。違いは、ページのサイズが変更されたときの応答方法です。2番目のバージョンは縮小してより良く反応します

ただし、コンテナを上記の画像と一致させたい場合はclass="container-fluid"、class="row-fluid"

また、スパンと数字の間のスペースを削除します

class="span 3"

言うべき

class="span3"
于 2013-03-24T21:43:02.893 に答える