0

このCSSコードは、FireFoxを除くすべてのブラウザで機能します。なんで ?どうすれば修正できますか?

.img_box {
  width: 110px;
  height: 160px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url('https://www.google.com/images/srpr/logo3w.png');
}

前もって感謝します。

編集: これが私が使用したいHTMLです:

<img class="img_box" />
4

2 に答える 2

1

Firefox がソースのない画像に遭遇すると、画像を代替テキストに置き換えます。個人的には、これは非常に面倒です。具体的にプレースホルダー画像を作成しない限り、レイアウトをテストできず、何らかの理由でそれらの画像が利用できない場合、レイアウトが完全に壊れてしまうからです。

残念ながら、私はまだこの問題の解決策を見つけていません。

ただし、あなたの場合は、画像を使用する代わりに、を使用して CSS にdiv追加する方がはるかに優れています。display:inline-block

于 2012-04-09T21:17:26.953 に答える
0

解決策1:

.img_box {
  width: 110px;
  height: 160px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url('https://www.google.com/images/srpr/logo3w.png');
  display: block;
}

解決策2:

<div class="img_box"></div>
于 2012-04-09T22:19:15.053 に答える