css背景圖像不會顯示在IE或Chrome中

我正在嘗試使用background-image：url（'path/to/image.png'）;放置一個背景圖像中一個div通過ID：css背景圖像不會顯示在IE或Chrome中

#logo_block > #main_logo { 
background-image: url("img/JaxonsBlack.png"); 
width:450px; 
height:auto; }

和HTML是這樣的：

<div id="logo_block"> 
     <!-- This will remain static. --> 
     <div id="main_logo"> 
      <!--<img id ="logo" src="img/JaxonsBlack.png" width="400" />--> 
     </div> 

     <!-- This div will be dynamically populated in the future 
     it resides immediately under the logo image--> 
     <div id="sub_title"> 
      <h3>sample</h3> 
     </div> 
    </div>

好了，不管我怎麼努力，我不能得到這個工作。

它不是一個路徑問題。下面的html中的img標籤在沒有註釋的情況下工作正常。我可以將相同的CSS應用於身體，它也可以很好地工作。
選擇器。它不是那些。我看着Chrome的開發者工具，風格正在適當地適用於div。我也從父div中刪除了div，並使用#main_logo作爲選擇器，嘗試了一個類等等等等。
高度。它不是高度風格。我已經看到，提及，有或沒有高度，寬度等，它仍然無法正常工作。

我似乎無法在任何地方找到任何有關此問題的信息。就我所見，我的語法是正確的，並且多個站點都支持這一點。這不適用於Chrome或顫動 IE。我的FF安裝目前已破解（再次），所以我沒有嘗試過。我懷疑它會有什麼不同，但如果它不適用於Chrome或IE，我仍然需要弄清楚。

我在這個機智的結尾。它根本沒有意義。

來源

2012-02-09 Garrett

它是的高度樣式。 height設置爲auto，所以它只會顯示所有內容的高度，但沒有內容，因此它的高度爲0px。

http://jsfiddle.net/Z632P/ - 改變height到auto然後回到100px。

來源

2012-02-09 01:34:49 Joe

我同意喬 - 它必須是高度。作爲一個測試，嘗試在＃main-logo div中應用背景顏色，然後弄亂高度。 – chipcullen 2012-02-09 01:42:39

哇。顯然，在整個下午我的頭髮剪影中，我沒有碰到那個組合。沒有指定寬度和高度，它根本不起作用。有時候我有這樣的n00b。：P 謝謝，這解決了它。 – Garrett 2012-02-09 01:50:16

Err ...沒有評論：P但是，是的，如果一個元素是空的（沒有任何尺寸）它將關閉到0px的0px，所以你必須強制它:) – Joe 2012-02-09 01:52:03

嘗試：

height: 100%;

代替。

如果它在其他瀏覽器中工作，這應該修復它。

來源

2012-02-09 01:46:37 wvm2008

這將無法正常工作如果div是空的。 – Sam 2012-02-09 01:50:20

你的風格是在一個單獨的css文件中定義的嗎？如果是這樣，路徑應該是相對於CSS文件，而不是HTML文件。所以，如果你在/styles/blah.css中有你的css文件，並且你有url img/JaxonsBlack.png，它會在/styles/img/JaxonsBlack.png中查找它。如果是這種情況，您可以通過將其更改爲/img/JaxonsBlack.png來修復它。正如其他人所提到的，除非它具有內容，否則該div將不具有垂直高度，或者您定義了一個。

來源

2012-02-09 01:48:48 SynXsiS

css背景圖像不會顯示在IE或Chrome中

回答

相關問題