繁体   English   中英

宽度缩小时图像不会调整高度

[英]Image won't resize in height when it shrinks in width

我在div有一个图像,可以具有各种分辨率。 如果我的图片较宽且高度较低(例如730x90),则无法在移动设备上正确显示。 它的宽度缩小,但高度保持不变。 这是代码(我使用React在JS中编写CSS,所以这是有效的代码,确切的synthax并不是这里的问题)。 child是一个span ,其中仅包含一个img

    parent: {
        '@media(max-width:744px)': {
            minWidth: '100vw',
        },
        '@media(max-height:823px)': {
            minHeight: 'auto',
        }
    },
    child: {
        '@media(max-width:744px)': {
            maxWidth: '80vw',
            maxHeight: '100vw',
            width: 'auto',
            height: 'auto',
            display: 'block',
            margin: 'auto'
        }
    }

尝试注入一些JQuery:

 window.onresize = function() {
    $(".thumb").each(function() {
        this.style.display = "none";
        this.offsetWidth;
        this.style.display= "block";
    })
}

让我知道你的结果!

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM