PNG изображение появляется в IE8, исчезает в IE7 - PullRequest
2 голосов
/ 01 февраля 2010

Я пытаюсь отобразить логотип (PNG, созданный в Paint.NET) на своей веб-странице (XHTML 1.0 Transitional), например:

<body>
  <div class="header">
    <div class="logo">
      <img src="logo.png" />
    </div>
  <!-- etc. -->

.header оформляется следующим образом:

.header {
  background-color: Black;
  color: White;
  margin-left: -3em;
  padding-top: 12px;
  padding-left: 2em;
  padding-bottom: 12px;
  font-size: 1.4em;
}

.header .logo {
  float: right;
}

Логотип белый на черном и некоторых других цветов.

В IE8 (и Google Chrome) изображение отображается правильно. На IE7 изображение вообще не отображается. Что я делаю не так?

Меня не волнует IE6.

Ответы [ 4 ]

1 голос
/ 01 февраля 2010

Если перетащить изображение непосредственно в IE7, оно отображается правильно?

Если это так, то проблема не в изображении, а в вашем HTML или CSS.

У меня нет IE7, поэтому я не могу тестировать напрямую, но я могу порекомендовать простой подход к устранению неполадок:

  • Удаляйте стили CSS по одному, пока изображение не отобразится во всех ваших целевых браузерах. Это должно сказать вам , что вызывает проблему (надеюсь, причина , почему тогда будет относительно легко понять)
0 голосов
/ 08 мая 2015

У меня есть эта проблема в приложении MVC.NET, использующем тег IMG со строкой src = data.

В конце концов, мне все равно, что это вызывает, так как это 1 изображение из 60000 (и только в IE)

function showPicture() {
        if ($('#picture').css("display") == "none") {
            $('#picture').css("display", "");
            clearInterval(interval);
        }
    }

    var ua = window.navigator.userAgent;
    var msie = ua.indexOf("MSIE ");
    if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))
        interval = setInterval(showPicture, 500);

Хотя мне кажется странным, что только определенные записи приводят к тому, что атрибут Display: None применяется внутри строки, я могу поделиться этим, поскольку CSS Display: None не приходит из моего кода.

В любом случае, теоретически вы можете проверить, является ли это IE, прежде чем запускать этот код, используя фрагмент из проверить браузер IE

0 голосов
/ 01 февраля 2010

Если это поплавок: правильно, что портит его, то вы должны попытаться очистить свои поплавки. Попробуйте установить переполнение: скрыто; в классе .header или примените clear: оба к элементу, который следует за ним в разметке.

Также для тега img всегда требуется атрибут alt - однако вы можете оставить его пустым - alt = ""

0 голосов
/ 01 февраля 2010

HTML или XHTML? Не думайте, что самозакрывающийся img-тег действителен в HTML.

РЕДАКТИРОВАТЬ: вам также не хватает alt-атрибута.

...