1

私は使っている：

 <div class="class1">Image</div>
 <div class="class2">Image</div>
 <div class="class3">Image</div>
 <div class="class4">Image</div>

すべて同じ行にある必要がある背景として画像を使用しています（すべての画像）。私はfloat:left2つの画像がどのようになるかを使用していますfloat:right。しかし、私の問題は、ブラウザのサイズが変更されたときに始まります。すべての画像が異なる行に乱れます。

どんな助けでも感謝します。

4

3 に答える 3

0

親DIVに最小幅を定義するとよいでしょう。

たとえば、次のように記述します。

.parent{
    overflow:hidden;
    min-width:800px;
}
.parent > div{
    width:200px;
    height:100px;
    background:red;
}
.class1,.class2{float:left}
.class3,.class4{float:right}

これをチェックしてくださいhttp://jsfiddle.net/nRhed/

于 2012-09-21T11:54:56.773 に答える
0

あなたの質問は不明確です。

4つのdivすべて（および<img>の代わりにdivを使用しているのはなぜですか？）を続けて、ブラウザーウィンドウが小さすぎる場合は下の行に折り返さないようにする場合は、試してみてください（ 200pxの画像幅-簡単にするためにクラスの代わりにスタイルを使用-これは展開には適していません！）：

<div style="width:800px">
  <div class="class1">Image</div>
  <div class="class2">Image</div>
  <div class="class3">Image</div>
  <div class="class4">Image</div>
</div>

これにより、コンテナdivは、4つの画像すべてを連続して含むのに十分な幅になります。ただし、ブラウザの幅が十分に広くない場合は、水平スクロールバーが表示されます（ユーザーエクスペリエンスの観点からは適切ではありません）。

または、現在のHTMLを使用して、すべてを左にフロートさせます。ブラウザウィンドウのサイズが変更された場合、最後の画像は次の行にドロップされ、divは同じ順序のままである必要があります

于 2012-09-21T11:55:03.927 に答える
0

あなたの質問は明確ではありません。私がそれを理解した限り。これらのプロパティmax-width、min-width、max-heightおよび を確認してくださいmin-height。これらのプロパティは、Web レイアウトを安定させるため、Web デザイナーにとって永遠の友人です。詳細については、ここをクリックしてください。. 私たちがあなたに答えたとしても、あなたはそれらの使用の深い概念を理解していないでしょう. max プロパティと min プロパティに近い値を与えるようにしてください。

于 2012-09-21T11:59:12.053 に答える