1

画像ファイルをページの固定位置に表示したい。

次のコードを書きました。

<style>
.hovering-image{
    position: fixed;
    left: 70%;
    top:20%;
    height: 20%;
    width 10%;
}

</style>

<body>

    <div class="hovering-image">
        <img src="whatever.jpg">
    </div>

</body>

ただし、ウィンドウのサイズが変更されると、イメージが引き伸ばされて縦横比が変化します。画像を固定位置に表示し、ウィンドウのサイズを変更しても歪むことなく拡大縮小するより良い方法はありますか?

4

3 に答える 3

1

ウィンドウのサイズに応じて幅と高さの両方を設定するため、画像の縦横比が変わります。幅のみ (または高さのみ) を設定します。

max-widthまた、またはを使用max-heightして、画像の最大サイズを指定することもできます (およびmin-width/min-height最小サイズを指定することもできます)。

于 2013-08-07T09:22:26.930 に答える
0

左右の余白だけを与えてみてください。すべてのパラメータを指定すると、画像が歪みます。

これを参考にしてください。

http://www.ehow.com/how_12064024_overlay-image-fixed-position-website.html

于 2013-08-07T09:35:30.393 に答える