在Safari瀏覽器，Chrome瀏覽器和IE瀏覽器中顯示圖片div，但沒有在Firefox中顯示

因此，我最近開發了一個網站here，我想知道爲什麼我的圖片div（徽標）出現在Safari，IE和Chrome中，但不在Firefox中？我試圖尋找答案，但沒有任何工作。感謝幫助。在Safari瀏覽器，Chrome瀏覽器和IE瀏覽器中顯示圖片div，但沒有在Firefox中顯示

這裏是我的CSS代碼：

#logo-header { 
padding-top: 70px; 
content:url(../img/logo.png); 
margin: 0 auto; 
outline: 0; max-width: 100%; height: auto; 
margin-bottom: -50px; 
}

這裏就是我如何初始化它在HTML：

<div id="logo-header"> </div>

再次感謝您的幫助。

來源

2013-09-23 creatando

content屬性在常規元素上不受支持（我很驚訝它可以在其他瀏覽器中使用）。如果圖片是您內容的一部分，請將其置於標記中：

<div id="logo-header"> 
    <img src="img/logo.png" alt="Logo"> 
</div>

來源

2013-09-23 13:19:27 Pavlo

代替content使用background：

#logo-header { 
background: url(../img/logo.png) no-repeat center; 
}

來源

2013-09-23 13:11:26 Hossein

代替屬性'content'的嘗試使用'background-image'，火狐讀取它。

來源

2013-09-23 13:14:01

啊。感謝你 - 我明白我現在做的更多。我想我會把圖像放在標記中，如下所示！ – creatando

Firefox只接受content僞元素lie before和after。

您可以將您的CSS更改爲類似：

background: transparent url(../img/logo.png) no-repeat center center;

，並設置適當的高度（像300px）。

來源

2013-09-23 13:17:59 Steven

在Safari瀏覽器，Chrome瀏覽器和IE瀏覽器中顯示圖片div，但沒有在Firefox中顯示

回答

相關問題