web-dev-qa-db-ja.com

インラインの「背景画像」スタイルがChrome 10およびInternet Explorer 8で機能しないのはなぜですか？

なぜ 次の例 はFirefox 4で画像を表示しますが、Chrome 10およびInternet Explorer 8では表示しないのですか？

HTML：

<div style="background-image: url('http://www.mypicx.com/uploadimg/1312875436_05012011_2.png')"></div>

CSS：

div {
    width: 60px;
    height: 60px;
    border: 1px solid black;
}

回避策のアイデアはありますか？

htmlcssgoogle-chromeinternet-explorer-8background-image
49
Misha Moroshko

C-smileが述べたように：url()のアポストロフィを削除するだけです：

<div style="background-image: url(http://i54.tinypic.com/4zuxif.jpg)"></div>

ここでデモ

99
Misha Moroshko

uは幅と高さも指定する必要があります

 <section class="bg-solid-light slideContainer strut-slide-0" style="background-image: url(https://accounts.icharts.net/stage/icharts-images/chartbook-images/Chart1457601371484.png); background-repeat: no-repeat;width: 100%;height: 100%;" >
5
Chetan Kumar

Chrome 11は、デバッガーで以下を吐き出します。

[エラー] GET http://www.mypicx.com/images/logo.jpg undefined（undefined）

ホスティングサービスは、これらのブラウザが正しく取得するのを妨げているファンキーな動的システムを使用しているようです。 （代わりに、デフォルトのベースイメージをフェッチしようとしますが、これは問題のあるjpegです。）イメージの別のコピーを別の場所にアップロードすることはできますか？私はそれが長距離で最も簡単な解決策になると期待しています。

編集：通常の<img>タグを使用して画像を配置すると、Chromeで何が起こるかを確認できます;）

5
lpd

google chromeブラウザバージョン11.0.696.60で動作しています

他のアイテムだけで基本的なタグと別のcssファイルのないシンプルなページを作成し、画像を取得しました

これは私が<div id="placeholder" style="width: 60px; height: 60px; border: 1px solid black; background-image: url('http://www.mypicx.com/uploadimg/1312875436_05012011_2.png')"></div>をセットアップするものです

2
xLRDxREVENGEx