美文网首页
css 图片高度自适应

css 图片高度自适应

作者: 前端召唤师 | 来源:发表于2019-07-31 09:52 被阅读0次

    开始采用js,获取屏幕宽度,按宽高比来设置图片大小。

    var wid = window.screen.width;
    wid = wid * 0.85;
    $('.Img').css('width',wid+'px');
    $('.Img').css('height',wid/15*26+'px');
    

    手机端/电脑测试都没问题,但是用微信电脑版自带浏览器打开时会变形,因为其屏幕宽度为1920。

    解决:用css

    .img{
        width:90%; //不设置高度,让其自适应
    }
    

    相关文章

      网友评论

          本文标题:css 图片高度自适应

          本文链接:https://www.haomeiwen.com/subject/pizarctx.html