Img在移动css中伸展

时间:2015-02-15 16:37:20

标签: css image stretched

我正在尝试建立一个简历网站。从手机上看,我的图像有问题。它看起来很紧张。

我正在使用的CSS在这里:

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

图像看起来很紧张。我不介意是否显示左右一些厘米。如果我尝试height: relative;它看起来不错,但距离下一个街区很远。

1 个答案:

答案 0 :(得分:1)

height: 100%;始终将其拉伸到屏幕高度,不会影响宽度。更好的方法是使用Jquery设置相对于宽度的高度。一种方法是找到高度:宽度的比例(例如1px:1.75px)并将其应用于宽度

$(window).ready(function () {
   var height = screen.height;
   var width = height * 1.75 + 'px';
   $(img).css('height',height);
   $(img).css('width',width);
};