2012-05-07 12 views
0

ChromeとFFはOKですが、IE9はhtmlの背景を表示できません。色は表示されますが、画像は表示されません。私はそれをいかに有益に働かせることができますか?IEはhtmlの背景画像を表示できません(カラーはOK)

テストをオン:here

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<style type="text/css"> 
html { 
    width:100%; 
    height:100%; 
    background-color: #ffeacd; 
    background-image: url(bg.png); 
    background-position: 0px 0px; 
    background-repeat: repeat-x; 
    margin: 0px; 
    padding: 0px; 
} 
body { 
    background-position: center top; 
    width:100%; 
    height:100%; 
    margin: 0px; 
    padding: 0px; 
    background-image: url(bg_overlay.png); 
    background-repeat: no-repeat; 
} 
.content { 
    width:1020px; 
    height: 100%; 
    padding: 0px; 
    margin-top: 0px; 
    margin-right: auto; 
    margin-bottom: 0px; 
    margin-left: auto; 
} 
</style> 
</head> 
<body> 
<div class="content"></div> 
</body> 
</html> 
+2

IE9とIE8でテストされました。画像はそこにあります。しかし、それは巨大で、ダウンロードされるまで待たなければなりません。あなたは、ウェブのための最適化されたバージョンでそれを再保存する必要があります –

+0

あなたのページでいくつかの研究をしている、私は身体の背景画像を無効にすると、HTMLの背景画像を表示します、それはこれまで収集したものです。 .. – Rodik

+1

これが役に立ちましたら、前の質問のこの人はdoctypeを変更して回避策を見つけました。私は自分でそれをテストすることはできませんが、それを試してみる必要があります:http://stackoverflow.com/a/6834087/874533 – Rodik

答えて

3

はIEがHTML要素の背景画像タグを許可されていないと思われます。このようなことをやってみてください。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<style type="text/css"> 
body { 
width:100%; 
height:100%; 
background-color: #ffeacd; 
background-image: url(header-ad.png); 
background-position: 0px 0px; 
background-repeat: repeat-x; 
margin: 0px; 
padding: 0px; 
} 
#wrapper { 
background-position: center top; 
width:100%; 
height:100%; 
margin: 0px; 
padding: 0px; 
background-image: url(hdr_GSA_lp.jpg); 
background-repeat: no-repeat; 
} 
.content { 
width:1020px; 
height: 100%; 
padding: 0px; 
margin-top: 0px; 
margin-right: auto; 
margin-bottom: 0px; 
margin-left: auto; 
} 
</style> 
</head> 
<body> 
<div id="wrapper"> 
<div id="content"> 

</div> 
</div> 
</body> 
+0

それは、それを保存しようとしているyaay;) –

関連する問題