修復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