-1

我在不同的浏览器上显示缩放背景时遇到了一些困难。我在 Google chrome 浏览器上创建了该网站，但在 iPhone 或更早版本的 IE 上加载该网站时，背景无法缩放，或者根本不显示。

我只是使用了css代码：

背景尺寸：100% 150%；

然后我将其更改为：

背景尺寸：自动；

但这仍然会带来一些麻烦。知道如何在从版本 6 到现在的每个浏览器和 IE 上调整/缩放此图像的大小吗？

编辑

使用下面的代码，一切都可以在 Chrome、FF 和最新的 IE 上运行，但在 IE8（以及我认为以下）上，它显示了未拉伸的图片。在 iPhone 上，它根本不显示任何内容。：/

#head-div
{
    padding-bottom: 15%;
    width: 100%;
     background: url(../img/banner.gif) no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/banner.gif', sizingMethod='scale');
}
4

2 回答 2

2 
body {
  background: url(image.jpg) no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.jpg',     sizingMethod='scale');
  -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.jpg', sizingMethod='scale');
}

这些是跨浏览器的要求。堆栈溢出中已经有 5 个这样的确切问题的答案与我的完全一样，所以没有必要问这个问题

于 2013-08-08T20:40:24.620 回答
1

我建议使用CSS3Pie polyfill脚本。

该脚本无缝地为旧 IE 版本添加了对各种 CSS 功能的支持，包括background-size.

它可以在 IE6 及更高版本中运行，并且只需要在您的 CSS 文件中添加一点点额外代码即可激活它，其他浏览器将完全忽略这些代码。

于 2013-08-08T21:25:56.627 回答