PNG圖像出現在IE8，消失在IE7

我試圖在我的網頁上顯示的標誌（在Paint.NET創建PNG）（XHTML 1.0過渡），像這樣：PNG圖像出現在IE8，消失在IE7

<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。

來源

2010-02-01 Roger Lipscombe

運行使用片斷此代碼之前的IE'我不關心IE6' ......我嫉妒 – SLaks 2010-02-01 14:15:49

可能要在您的代碼中添加HTML和CSS。 – norlando 2010-02-01 14:25:23

它似乎是「浮動：正確」，它弄亂了它;如果我刪除它，那麼圖像就會出現。另外，如果我刪除'background-color'，那麼圖像就會出現。 – 2010-02-01 15:34:37

如果它是浮動：正確的食堂起來perheps你應該設法清除彩車。嘗試設置溢出：隱藏;在.header類上，或者應用清除：在標記中的後面的元素上。

而且img標籤總是需要的alt屬性 - 但是你可以讓它空白 - ALT =「」

來源

2010-02-01 15:39:30 easwee

'overflow：hidden'使它工作。小心解釋爲什麼？ – 2010-02-01 16:29:27

通過設置th屬性overflow：hidden;在容器div上，你不知何故將它包含在內部的元素中，並以某種方式清除它自己。我相信它被認爲是一個CSS錯誤，但適用於所有瀏覽器。你也可以用：auto或：scroll屬性來清除它，有時你也需要設置寬度（通常是100％）。只要注意，不要使用它來清除包含下拉菜單的div，或者在內容偏離容器外的其他情況下，因爲它會將其切割到邊緣。 – easwee 2010-02-01 16:47:31

HTML or XHTML？不要以爲自動關閉img-tag在HTML中是有效的。

編輯：你也缺少alt屬性。

來源

2010-02-01 14:28:04 dalle

XHTML 1.0 Transitional;更新的問題。 – 2010-02-01 15:26:23

這是一個標誌;它沒有視力受損的等效物。我還需要一個alt屬性嗎？ – 2010-02-01 15:27:24

如果將圖像直接拖放到IE7中，它是否顯示正確？

如果是這樣，那麼問題不在於圖像，而是與您的HTML或CSS。

我沒有IE7這裏，所以不能直接測試，但我可以推薦一個簡單的故障排除方法：

刪除CSS樣式，一個接一個，直到圖像中所有的渲染您的目標瀏覽器。這應該告訴你什麼原因造成的問題（有希望的原因爲什麼然後將相對容易捉摸）

來源

2010-02-01 14:34:52

查看原始問題的更新和評論。 – 2010-02-01 15:34:55

我在使用了SRC =數據串的IMG標籤的MVC.NET應用這個問題。

在一天結束的時候，我不在乎什麼導致它，因爲它是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不是來自我的代碼。

無論如何，從理論上說，你可以檢查，看它是否從check for IE browser

來源

2015-05-08 13:42:47

PNG圖像出現在IE8，消失在IE7

回答

相關問題