1

履歴書のウェブサイトを構築しようとしています。携帯電話から見ると、画像に問題があります。伸びて見える。

私が使用しているCSSはここにあります:

        .image-featured img
    {
        position:absolute;
        top: 0;
        bottom:0;
        height: 100%;
        margin-left:auto;
        margin-right:auto;
        border-radius: 0.35em;      
    }

画像が引き伸ばされたように見えます。左右から数cm出なくても構いません。試しheight: relative; てみると良さそうに見えますが、次のブロックからの距離が大きいです。

4

1 に答える 1

1

height: 100%;幅には影響を与えず、常に画面の高さに引き伸ばします。それを行うより良い方法は、Jquery を使用して高さを幅に対して相対的に設定することです。これを行う 1 つの方法は、高さ:幅の比率 (たとえば 1px:1.75px) を見つけて、それを幅に適用することです。

$(window).ready(function () {
   var height = screen.height;
   var width = height * 1.75 + 'px';
   $(img).css('height',height);
   $(img).css('width',width);
};
于 2015-02-15T16:54:45.130 に答える