0

Bootstrap の可変グリッドを使用する場合、コンテンツを行の幅全体に広げたい場合、列を宣言する必要がありますか。つまり、これで十分か

<div class="row-fluid">
  This column should span the full width of the row
</div>

または、これを行うことが本当に必要ですか（ドキュメントが示唆するように）：

<div class="row-fluid">
  <div class="span12">This column should span the full width of the row</div>
</div>

また、ドキュメントによると、流体グリッドに列をネストしたい場合

流体グリッドでのネストは [非流体グリッドとは] 少し異なります: ネストされた列の数は、親の列の数と一致してはなりません。代わりに、各行が親列の 100% を占めるため、ネストされた列の各レベルがリセットされます。

次に、ドキュメントはこの例を示します。最初の行は 1 つの全角列で、2 番目の行は 2 つの半角列です。

<div class="row-fluid">
  <div class="span12">Fluid 12
    <div class="row-fluid">
      <div class="span6">Fluid 6</div>
      <div class="span6">Fluid 6</div>
    </div>
  </div>
</div>

行のクラス名は別として、これが非流動グリッドとどう違うのかわかりません。また、この例はステートメントと矛盾しているようです

ネストされた列の数は、親の列の数と一致してはなりません

前回は 6 + 6 = 12 を確認したためです。誰かがこの説明を改善できますか?

4

1 に答える 1

4

(1) これが非流体グリッドとどのように異なるのかわかりません

  • パーセンテージを使用しています

(2) ネストされた列の数は、親の列の数と一致してはなりません

悪い例ですが、それらが単に意味することは、ネストされているものに関係なく、クラス名の数字の合計は常に 12 になるということです。

正解です：

<div class="row-fluid">
  <div class="span6 row-fluid">
     <div class="span4"> &nbsp; </div>
     <div class="span4"> &nbsp; </div>
     <div class="span4"> &nbsp; </div>
  </div>
</div>

これの代わりに、これは間違っています:

<div class="row-fluid">
  <div class="span6 row-fluid">
     <div class="span2"> &nbsp; </div>
     <div class="span2"> &nbsp; </div>
     <div class="span2"> &nbsp; </div>
  </div>
</div>
于 2012-12-03T19:52:24.463 に答える