1

Twitter Bootstrap を使用しています。私はテーブルにレイアウトされた3つの要素を持っています:

<table>
<tr><td><img /> <span>example</span></td>
<td><img /> <span>example</span></td>
<td><img /> <span>example</span></td></tr>
</table>

これは応答性に優れており (テーブルの幅は 100%)、ブラウザー ウィンドウを縮小すると縮小します。しかし、ウィンドウを小さくしすぎると、表のセルが押しつぶされてしまいます。むしろ、表のセルを特定の幅で垂直に積み重ねたいと思います。

Twitterブートストラップのdivでこれを達成できますか? もしそうなら、どのように。ありがとう

4

2 に答える 2

1

テーブルの代わりに流動グリッド システムまたは固定グリッド システムの使用を検討してください。この例は、あなたが話していることに似たものを示しています。上記のコードは、次のようになります。

<div class="row">
    <div class="span4">
        <img/><span>example</span>
    </div>
    <div class="span4">
        <img/><span>example</span>
    </div>
    <div class="span4">
        <img/><span>example</span>
    </div>
</div>

このページでは、グリッド システムについて詳しく説明します。レスポンシブ CSS ファイルを含めることで、ビューポートが幅 767 ピクセル未満に縮小されたときに、グリッド内の列が垂直に積み上げられます。

于 2013-06-04T12:45:31.177 に答える
0

float セットで使用する必要があります。これは、スペースが狭められたときに積み重ねるのに役立ちます。さらに、制限後に縮小しないように最小幅パラメータを設定できます。

于 2013-06-04T12:36:51.830 に答える