2

Chromeに奇妙なバグがあり、次のCSSルールを要素に適用しています。

#element {
  background-color: #0E0F10;
  background-image: url(images/the_background.jpg);
}

これで、「＃element」を含む新しいページを初めて開いたときに、ctrl+f5でページキャッシュを更新するまで背景画像が表示されません。

Pragma、Expires、およびCache-controlメタタグを追加してみましたが、違いはありません。初めて表示される画像を作成する唯一の方法は、次のように絶対URLを入力することです。

#element {
  background-color: #0E0F10;
  background-image: url(http://site.com/images/the_background.jpg);
}

ここで問題となるのは、サイトのURLをハードコーディングできないことです。相対パスまたは相対パスを使用する必要があります。

周りを見回すと、Chromeの関連するバグを修正するための汚いトリックが見つかりました。これは、偶然にもこの問題を修正します：http: //blog.andrewcantino.com/blog/2012/02/15/fixing-the-chrome-background-refresh-bug //

基本的に、最初にページを開いたとき、すべての背景画像がJavaScriptを介して再読み込みされ、ここからは正常に機能します。

ただし、より洗練された修正を実装するか、問題の本当の原因を見つけたいと思います。

アドバイスをいただければ幸いです。

4

5 に答える 5

0

試す background: #0E0F10 url('http://site.com/images/the_background.jpg');

また、必ず幅と高さをセレクターに追加してください!

于 2012-10-01T19:13:20.100 に答える
0

信じる直前にたまたま同じ問題に遭遇しました。

あなたは答えを受け入れていないので。あなたは試してみたいかもしれません、私のために働いたもの：

それ以外の：

  background-image: url(images/the_background.jpg);

次のように変更します。

  background-image: url('images/the_background.jpg');

ダニで...奇妙に思えますが、それは私にとってはうまくいきました。私のURLにもすべてアンダースコアがあったので、これに関連している可能性がありますが、よくわかりません.

とにかく、URLを引用符で囲むと、機能するはずです。

于 2014-04-15T14:12:34.427 に答える
0

これは古い質問です。しかし、ちょうど同じ問題に直面しました。私の問題はに関連していましz-indexた。たとえばz-index:2000;、値が増加し、すべてが機能するようになりました。z-index他の要素を確認する必要があるだけです

于 2018-07-28T14:13:51.620 に答える