背景大小包含在 Internet Explorer 中不起作用答案

【问题标题】：Background-size contain not working in internet explorer背景大小包含在 Internet Explorer 中不起作用
【发布时间】：2014-09-25 10:58:42
【问题描述】：

我使用的是 Chrome 并且代码工作正常，但是，当我将其加载到 Internet Explorer 中时，它会以实际大小显示图像，而不是缩放以适应屏幕。我希望图像位于页面的左侧并从上到下覆盖，而不是从左到右。我希望它保持不变，以便正确缩放图像。这就是我所拥有的。有没有更简单的方法？我正在使用 Internet Explorer 8。预计到达时间：图片为 340x554 像素

<!DOCTYPE html>
<html>
<head>

<style>
body{
background-color:#000000;
}

#logo{
top:0;
bottom:0;
left:0;
position:absolute;
background-image:url('logo.jpg');
background-size: contain; 
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-repeat:no-repeat;
height:100%;
width:100%;
}

</style>
<title>Title</title>
</head>
<body>
<div id="logo">

</div>


</body>
</html>

【问题讨论】：

background-size: contain; 不受ie8支持； caniuse.com/#feat=background-img-opts

标签： html css contain

【解决方案1】：

如果您不使用精灵并且在您应用背景的容器内没有链接，您可以对 IE8 使用此修复：

  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='images/image.jpg',
    sizingMethod='scale');

    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='images/image.jpg',
    sizingMethod='scale')";

【讨论】：

谢谢。这似乎几乎可以工作，但它仍然没有触及浏览器窗口的底部，当我调整窗口大小时，它会切断图像的底部。我认为我的 CSS 有错误
糟糕。我试过了，现在它适合整个屏幕，而不仅仅是容器。（对不起，IE屏蔽了初始脚本，当我解除屏蔽时，图像占据了整个屏幕）
那么您需要对答案进行投票，而不是将我的答案重新发布到您的代码中：) 您知道这是有礼貌的；)
很抱歉。当我在 div 中设置宽度时，它会缩放到该大小。我想设置高度并使宽度保持在图像的原始比例。图像位于屏幕的左角，如果我使用 width:100%，它可以在 Chrome 中运行，但在 IE8 中它会缩放到整个屏幕。有任何想法吗？谢谢。