0

em ベースのレイアウトで画像を処理する方法は次のとおりです。

.model {
    width: 14.5em;
    float: left
    }

.model img {
    width: 100%;
    height: auto;
    }

問題は、一部の画像の縦横比や寸法が異なり、レイアウトが崩れることです。

だから私は画像にemで固定サイズを与えようとしています。

私がこれを行う場合:

.model {
    width: 14.5em;
    float: left
    }

.model img {
    width: 14.5em;
    height: 14em;
    }

高さは正しく設定されていますが、幅が 14.5em 未満です。

理由はありますか?

4

2 に答える 2

0

max- および min- プロパティを使用してみてください。

.model img {
width: 14.5em;
height: 14em;
max-height: 14.5em
min-height: 14.5em
}

タグで幅と高さを定義しないのはなぜですかimg(ページのレンダリングは高速です)。

于 2012-09-05T12:50:58.877 に答える
0

サイズを変更すると、画像の幅と高さが予期しないものになり、以下の方法を試してください。

.model {
    width: 14.5em;
    float: left
    }

.model img {
    max-width: 14.5em;
    height:auto;
    }

それ以外は

.model {
    width: 14.5em;
    float: left
    }

.model img {
    width: auto;
    max-height:14.5em;
    }
于 2012-09-05T13:27:41.730 に答える