internet-explorer - 如何使 "background-size"在 IE8 中工作？

Question

我正在为较新的浏览器构建一个网站，但我希望它在 IE8 中看起来也不错。一切都很好，直到我遇到问题。我发现 background-size 在 IE8 中不工作。经过一些研究，我找到了某种“hack”，但它对我不起作用。

也许我做错了什么；请看一下这段代码，也许会提出一个解决方案来修复 IE8 中的背景大小(最好是 CSS 解决方案)。

.logo {
    width: 190px;
    height: 204px;
    background-image: url("../img/logo.png");
    background-repeat: no-repeat;
    background-size: 190px 204px;

    /** This is the so called IE8 hack, but it doesn't seem to work **/

    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/logo.png',sizingMethod='scale');

    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/logo.pn',sizingMethod='scale')";

    /** End of Hack */

    position: absolute;
    display: block;
    z-index: 99;
    margin: -73px 0 0 405px;
}

Answer 1

重点是 Retina 屏幕，对吧？由于这种屏幕的市场份额不是很大，我更愿意先使用“标准”图像，然后在需要时用高分辨率替换它。

您可以使用 Retina.js 来完成例如。

或者您也可以简单地使用图片标签。它将在 IE8 上运行。不要忘记定义宽度和高度属性。

<a href="/" class="logo">
  <img src="img/logo.png" width="190" height="204" alt="Bryuvers">
</a>