- ベストアンサー
IEで背景画像が表示されない
- IEで背景画像が表示されない問題が発生しています。
- 検索して試した解決方法がうまくいかず、白色の背景が表示される状態が続いています。
- 解決のヒントをいただけると助かります。
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
＞("./img/back.jpg"); 部分をフルパスか、本体BODYに直接指定するかでどうですか？
その他の回答 (3)
度々すみません。NO.2～4の答えは全部私です。 訂正した際にCSSを内部に書いてしまったのをそのままにしてしまいました。 これが完全版という事で、NO.2とNO.3は無視して下さい。。。 どこが悪いのかというと、HTMLもCSSも抜粋的なソースかと思いますので、断定できませんでした。 IEだけうまくいかないという事でしたね。IEは悪く言えばバグが多く融通が利かない。よく言えば文法などに正確でうるさいブラウザです（良く言ってないか…）。それに対してFirefoxやSafari等は結構文法や書き方を間違えていても気を利かして思い通りに表示してくれます。下にちゃんと表示される（ハズ）ソースを書きました（勝手にHTMLは4.01のtransitionalにしちゃいました。）ので本当のソースと見比べてヒントにして頂ければと思います。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>あああああ</title> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" media="all" href="text.css" type="text/css" /> </head> <body>あいうえお</body> </html> 【CSS部分】 @charset "UTF-8"; body{ background : url(./img/back.jpg) left top repeat; }
お礼
ありがとうございます。参考にいたします。
補足
HTML4.01では私の方でも既に表示が成功しております。ですが要望に対応してHTML5で書きなおしたところ、発生した問題なのであります。ですので質問文にあるソースの通りHTML5で記述しておりました。また質問文のソースは問題が発生する最小構成で書いたつもりです。元々の構成を書くと足りなくなってしまうので。
2か所ちょっとしたミスをしてました… こっちを使ってください。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>あああああ</title> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" media="all" href="text.css" type="text/css" /> </head> <body style="background : url(./img/back.jpg) left top repeat;">あいうえお</body> </html>
どこが悪いのかというと、HTMLもCSSも抜粋的なソースかと思いますので、断定できませんでした。 IEだけうまくいかないという事でしたね。IEは悪く言えばバグが多く融通が利かない。よく言えば文法などに正確でうるさいブラウザです（良く言ってないか…）。それに対してFirefoxやSafari等は結構文法や書き方を間違えていても気を利かして思い通りに表示してくれます。下にちゃんと表示される（ハズ）ソースを書きました（勝手にHTMLは4.01のtransitionalにしちゃいました。）ので本当のソースと見比べてヒントにして頂ければと思います。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>あああああ</title> <meta http-equiv="Content-Style-Type" content="text/css"> <link href="text.css" rel="stylesheet" type="text/css"> </head> <body>あいうえお</body> </html> 【CSS部分】 @charset "UTF-8"; body{ background : url(/img/common/maru1.gif) left top repeat; } P.S. ちゃんと表示されなかったら補足して下さい。責任を持って直します…
お礼
フルパスで指定したところ、うまく表示されました。ありがとうございました！
補足
本体BODYに直接記載する方式はHTML5ではサポートされておりません。