0

これがこれを尋ねるのに適切な場所かどうかはわかりませんが、複数の画像サイズを持ちながら応答性を維持するレイアウトを確立する方法を見つけようとしています.

ここに画像の説明を入力

画像は、CMS からのリストにもフィードされます。たとえば…</p> 

<ul>
                        <li> <img src="" alt="" /></li>
                        <li> <img src="" alt="" /></li>
                        <li> <img src="" alt="" /></li>
                        <li> <img src="" alt="" /></li>
                        <li> <img src="" alt="" /></li>
                    </ul>

私はcssをいじりましたが、制限が厳しすぎます.JSアベニューが進むべき道だと思いますが、何も見ていません..

これが間違ったセクションである場合は、ありがとうございます。

4

1 に答える 1

0

max-width:100% と height:auto を使用して、画像を境界の最大幅に自動リサイズできます。

img {
    max-width: 100%;
    height: auto;
}

上記のレスポンシブ イメージ CSS は、IE7 と IE9 では機能しますが、IE8 では機能しません。これを修正するには、width:auto を追加します。IE8 専用の条件付き CSS を適用するか、以下の IE ハックを使用できます。

@media \0screen {
  img { 
    width: auto; /* for ie 8 */
  }
}
于 2013-10-09T15:43:59.640 に答える