firefox在黑匣子中顯示圖像

我有2個鏈接的圖像，當我在safari或chrome中打開我的網站時它們工作正常，但是當我用firefox打開它時，圖像是黑色的概述。firefox在黑匣子中顯示圖像

，你可以在這裏看到：http://cl.ly/3c0G0W1F1T1Y1e3I0K08

的HTML代碼：

<div id="buy"><a href="http://stackoverflow.com"><img {border: none;} src="img/buy.png" /></a></div>

和

<div id="support"><a href="mailto:[email protected]"><img {border: none;} src="img/contact.png" /></a></div>

和CSS代碼是：

#buy { 
position: absolute; 
width: 153px; 
height: 50px; 
margin-left: 750px; 
margin-top: 370px; 
}

和

#support { 
width: 200px; 
height: 55px; 
margin-top: 80px; 
margin-left: auto; 
margin-right: auto; 
} d d

問題在哪裏？它仍然無法正常工作

來源

2011-04-16 Leon

在這裏，讓我闖入你的電腦，並竊取代碼到你的網站;）有非工作代碼會很好... – Blender 2011-04-16 21:41:37

試試這個CSS屬性

a img{border: none;}

來源

2011-04-16 21:40:59 naveen

仍然無法正常工作，編輯我的問題 – Leon 2011-04-16 22:23:41

我不能看到的Firefox 4和Chrome 10之間的任何差別，但你可以嘗試改變：

border: 0 none;

到：

border: none;

來源

2011-04-16 21:43:08 jeroen

仍然無法正常工作，編輯我的問題 – Leon 2011-04-16 22:24:34

很難給出一個關於邊界外觀的可靠答案（這可能是一個CSS問題），給出一個截圖。我的猜測是，這個圖片周圍有一個標籤，這會導致這個邊框出現。將a-tag內的圖像的border-width設置爲0或none。

在下面添加我的意見，所以我可以格式化他們：感謝您拓展您的問題。添加到您的樣式表：

#buy a img, #support a img { border: none; }

，並從img標籤移除{ border:none; }。或者保持樣式表不變並更改img標籤，用style="border: none"替換{ border: none; }。

我寧願選擇第一個選項。將盡可能多的樣式放在外部文件中。這使你的html乾淨整潔。

來源

2011-04-16 21:45:21 Jacco

仍然無效，編輯我的問題 – Leon 2011-04-16 22:25:10

感謝您拓展您的問題。將此添加到您的樣式表中： #buy a img，#support a img {border：none; } 並刪除{border：none; }從你的img標籤。或者保持樣式表不變並更改img標籤，替換{border：none; }通過style =「border：none」。我寧願選擇第一個選項。將盡可能多的樣式放在外部文件中。這使你的html乾淨整潔。 – Jacco 2011-04-17 19:02:16

firefox在黑匣子中顯示圖像

回答

相關問題