0

Bootstrap 2のグリッド システムに問題があります。

テキストを含むヘッダーと、その右側に画像を作成したいと考えています。
ということで を作り、その中にとrowを入れました。span8span4

ただし、ウィンドウが小さすぎてコンテンツを並べて表示できない場合は、span4div を div の前に配置しspan8ます。

<div class="hero-unit">
    <div class="container">
        <div class="row">
            <div class="span8">
                This is some text
            </div>
            <div class="span4">
                <img src="image.png" alt="" />
            </div>
        </div>
    </div>
</div>

これどうやってするの？
つまり、どうすればdivs の順序を変更できますか。

私が完全に誤解していなければ、そのようなことはドキュメントに記載されていません。

4

1 に答える 1

2

メディアクエリとフロートでそれを行うことができます。

次のようになります。

<div class="span4 pull-right"><!-- Image here --></div>
<div class="span8"><!-- Text here --></div>

ここで、メディアクエリ（response.lessファイルに表示）を使用して、画面サイズが特定のマークを下回ったときに切り替える必要があります。次に、span4'sfloatが削除されていることを確認します。.row-fluid通常の代わりに使用.rowし、見栄えを良くするために独自のパディングを使用する必要がある場合があります。

于 2013-02-10T19:46:58.537 に答える