元素背景圖片不顯示

如果我給一個div一個背景圖片，如下所示：元素背景圖片不顯示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<title>Untitled Document</title> 


<style> 

#image { 
background-image:url(Images/1.jpg); 
position:absolute; 
top:0px; 
left:0px; 
width:100px; 
height:100px; 
z-index:9999; 
} 

</style> 
</head> 
<body style="background-color:#FFF;" > 

    <div id="image"> </div> 

</body></html>

然後沒有任何顯示。我究竟做錯了什麼？我的圖像鏈接正確，除非我應該把東西放在div中，這應該是工作。

來源

2012-05-14 user1361747

它沒有寬度或高度 – tedski

只是去嘗試，仍然一無所獲。 – user1361747

您的背景圖片有兩個右括號' – tedski

你的div是空的，沒有設置維度。單獨背景圖像無法展開元素，直到它的可見的，這就是爲什麼你需要指定width和height

如果這仍然沒有對CSS文件

檢查圖像工作

檢查語法錯誤允許（確保它是644或更高）

來源

2012-05-14 19:43:08 fcalderan

將' '添加到您的div，以便它具有內容 – RGB

爲什麼大家一直告訴我做什麼已完成，這只是沒有工作 – user1361747

也不工作 – user1361747

高度默認爲內容的高度。由於沒有內容，高度爲0.寬度通常是自動的，但是當絕對定位時，寬度也變爲0。

所以剛纔的寬度和高度增加#myimage

例如：

#myimage { 
    background-image:url(http://placekitten.com/200/300); 
    position:absolute; 
    top:0px; 
    left:0px; 
    z-index:9999; 
    /*new*/ 
    width:200px; 
    height:300px; 
}

http://jsfiddle.net/NuCzS/

來源

2012-05-14 19:43:57 tedski

已經嘗試過，沒有工作。更新完整標記以供參考，請再次檢查。 – user1361747

你可以在jsFiddle中重新創建你的例子嗎？ – tedski

http://jsfiddle.net/zbEXK/它在jsfilddle中工作，但不在本地 – user1361747

元素背景圖片不顯示

回答

相關問題