使用CSS3背景大小的覆盖.因为这使用了一个css url的图像，它是可能得到全屏在IE8和更老的 - Using CSS3 background-size cover. As this uses a css url for the image, is it possible to get it fullscreen on IE8 and older?

Using CSS3 background-size cover. As this uses a css url for the image, is it possible to get it fullscreen on IE8 and older?

我使用css3来获得一个漂亮的全屏背景图像。

body{ 
  background: url(<?php echo $background_image; ?>) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

当然IE8和更老的不玩球，看起来很糟糕。有没有一种简单的方法让它在IE8上工作?

我看了看jQuery AnyStretch，它被称为using:

<script type="text/javascript">
  $.anystretch(<?php echo $background_image; ?>, {speed: 150});
</script>

，但即使它工作，我不能使它，所以它只能在IE8浏览器加载。使用anystretch，浏览器将加载图像两次(一次在css中，一次在anystretch创建的html中)。

谁有什么简单的方法可以做到这一点?

你看过这个网站的CSS技巧完美的整页背景图片吗?它涵盖了用于不支持CSS3属性(如background-size)的浏览器的不同技术。它既有纯CSS方法，也有jQuery辅助方法。

CSS技术#2涵盖IE8+回退

不，没有"简单"的方法。大多数人只是为旧浏览器选择一个替代背景，比如带有repeat-x的渐变图像。

，但即使它工作，我不能使它，所以它只能在IE8中加载浏览器。

这只会在ie8浏览器中加载:

<!--[if IE 8]>
<script type="text/javascript">
  $.anystretch(<?php echo $background_image; ?>, {speed: 150});
</script>
<![endif]-->

或者如果你想在ie8或更低版本上加载:

<!--[if lt IE 9]>
<script type="text/javascript">
  $.anystretch(<?php echo $background_image; ?>, {speed: 150});
</script>
<![endif]-->

http://www.quirksmode.org/css/condcom.html

你可以这样做。

background:url("image.png")no-repeat;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="image.png",sizingMethod=scale);
-ms-filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="image.png",sizingMethod=scale);

这取决于你想要多黑。你可以将css放在媒体查询中，这样它就不会在IE8或更早的版本中加载(因为它们不支持媒体查询)。然后在javascript周围放置条件注释，以专门针对IE8或更早的版本(如Alex W所示)。这样你只允许IE8或更早版本使用anyStretch功能，并避免为这些浏览器加载两次图像。