修复IE8中的背景图像

Question

在所有浏览器中，我使用以下css规则，它的工作原理

// it fits the background image to container
background-size: contain;
background-size: cover;

是否有css规则使其在IE8中工作，或者我应该使用javascript？

在javascript的情况下，我使用jquery。
实现目标的最佳方式是什么？

Answer 1

我也有同样的问题，但通过下面的链接我的问题解决了

http://css-tricks.com/perfect-full-page-background-image/

Answer 2

有一个jQuery插件或带有过滤器的这个javascript后备

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

检查同一页面以获取更多跨浏览器方法

Answer 3

你可以这样做：

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
  <img src="http://i47.photobucket.com/albums/f156/Bob_McBobBob/Awesome_Background_by_smirfy.jpg" class="bgimg" />
  <div class="frame">
    <div class="contents">
    page contents
    page contents
    page contents
    page contents
    page contents
    </div>
  </div>
</body>
</html>

CSS：

html {
 background:#000; 
}

html, body { 
  padding:0;
  margin:0;
  overflow:hidden;
  height:100%;
}

.bgimg {
  position:absolute;
  z-index:-1;
  width:100%;
  height:100%;
}

.frame {
  color:white;
  width:100%;
  height:100%;
  overflow:auto;
}

.contents {
 padding:10px; 
}

演示站点： http ： //jsbin.com/enevov/1/edit

你可以通过改变宽度来实现不同的效果：100％; 高度：100％; 在.bgimg上，根据你是否想要变形来实现不同的效果，例如只是width: 100%会让它触及顶部等等...

希望这有助于确定

Answer 4

这对我来说可以在IE8中在整个窗口上拉伸图像

http://css-tricks.com/perfect-full-page-background-image/

修复IE8中的背景图像

问题描述

4 个解决方案

解决方案1
2 2012-10-18 16:02:57

解决方案2
1 2012-10-18 16:00:28

解决方案3
0 2012-10-18 16:15:05

解决方案4
0 2013-10-24 07:16:15

修复IE8中的背景图像

问题描述

4 个解决方案

解决方案1 2 2012-10-18 16:02:57

解决方案2 1 2012-10-18 16:00:28

解决方案3 0 2012-10-18 16:15:05

解决方案4 0 2013-10-24 07:16:15

解决方案1
2 2012-10-18 16:02:57

解决方案2
1 2012-10-18 16:00:28

解决方案3
0 2012-10-18 16:15:05

解决方案4
0 2013-10-24 07:16:15