0

Twitter Bootstrap では、span5 と span7 を続けて使用しました。ブラウザをモバイル レイアウトにサイズ変更すると、span5 が上に表示されたままになり、span7 が span5 の下に表示されます。span7 を上に置き、span5 をその下に置きたいと思います。

それ、どうやったら出来るの?

前もって感謝します

4

2 に答える 2

0

このようなことを実現するには、DOM 構造を少し操作する必要があります。可能であれば、まずページ構造を「ハック」することをお勧めします。つまり、span7最初のものを DOM に入れてから、span7右とspan5左をフロートすることは可能でしょうか? これにより、どの画面サイズでも正しい順序で表示でき、メディア クエリを使用して必要なサイズでフロートを修正できます。

そうでなければ、これは jQuery の仕事のように思えます。jQuery を使用すると、その場で DOM 要素を操作できます。特定のウィンドウ幅で 2 つの要素の DOM 位置をジャグリングするスクリプトを簡単に作成できます。

于 2013-04-24T13:34:28.690 に答える
0

DOM ツリーでの順序を逆にして、次のようにします。

<div class="span7"></div>
<div class="span5"></div>

...次にfloat: right、span5 と span7 の両方に設定します。そのために特定の CSS クラス名を使用できます。

このように、より大きなディスプレイでは、span5 を左に、span7 を右に、モバイルでは span7 を上に、span5 を下に配置します。

于 2013-04-24T13:56:46.093 に答える