3

私はBootstrapを試しており、jsfiddle.net を使用して簡単で汚れたテストを作成しています。

ただし、非常に単純なテストでレンガの壁にぶつかっています。Bootstrap でグリッド システムを見たいだけなので、最初の例を複製しました。

<div class="row">
  <div class="span4">Span 4</div>
  <div class="span8">Span 8</div>
</div>

ただし、うまくいかないようです。"Span 4" と "Span 8" は、予想される 2 列のレイアウトではなく、積み重なって表示されます。

明らかな何かが欠けていますか？これがフィドルです：http://jsfiddle.net/8Xf2j/1/

ありがとう

4

2 に答える 2

3

bootstrap-combined.min.cssファイルを使用すると、レスポンシブ レイアウトが有効になります。

さらに、 a を使用し.containerて最小幅を設定する必要があります (そうでない場合、本体がウィンドウに収まり、小さな画面ではスタックが発生します)。

グリッドを使用する 1 つの方法を次に示します:デモ (jsfiddle)

<div class="container">
    <div class="row">
      <div class="span4">Span 4</div>
      <div class="span8">Span 8</div>
    </div>
</div>

bootstrap.min.cssファイルのみがリソースに含まれていることに注意してください。

于 2012-10-05T12:30:40.807 に答える
0

スパンの幅はすでに定義されていることに注意してください。その全幅は960px（span4（320px）+ span8（640px）= span12（960px））です。したがって、jsfiddleはこのような結果を示しています。参照用の境界線を設定して、htmlファイルを作成して試してください。

于 2012-10-05T07:11:12.673 に答える