html div背景圖片未顯示
[英]html div background image not showing up
問題描述
我正在制作網頁（我當然是newb），並且背景圖片不會顯示在div中。 我嘗試了background-image和background，但它們都不起作用...這是代碼
如果有人可以幫助那將是很棒的！
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body {background-color:gray;}
</style>
</head>
<body>
<div style="background-image: url('/ximages/websiteheader1.png');height:200px;width:1200px;">
</div>
</body>
</html>
5 個解決方案
解決方案1
18 2014-01-22 02:20:11
關於路徑的快速和小課程
絕對路徑
http://website.com/assets/image.jpg
如果圖片不在您的域中 -請去那里查找圖片
//website.com/assets/image.jpg
使用http或https協議加載的圖像
相對路徑
（如果映像位於同一服務器上，供內部使用 ）
image.jpg
圖像與調用圖像的文檔位於同一文件夾中！
./image.jpg
與上面相同， 圖像與調用圖像的文檔位於同一文件夾中！
/assets/image.jpg
與絕對路徑類似，只是省略了協議和域名
從我的根文件夾/開始搜索我的圖片，而不是assets/
assets/image.jpg
這次資產與文檔位於同一位置，因此進入圖像資產
../assets/image.jpg
從文檔所在的位置，將一個文件夾返回 ../並進入assets
../../image.jpg
返回 兩個文件夾，這是我的形象！
../../assets/image.jpg
返回 兩個文件夾../../ 然后進入 assets
解決方案2
14 已采納 2014-01-22 01:38:02
我建議將CSS從內聯范圍移開。 假設您的.png文件確實存在，請嘗試設置背景大小並重復標記。
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body {background-color:gray;}
#mydiv {
background-image: url('/ximages/websiteheader1.png');
background-repeat:no-repeat;
background-size:contain;
height:200px;width:1200px;
}
</style>
</head>
<body>
<div id="mydiv">
</div>
</body>
</html>
如果這樣不起作用，請嘗試在瀏覽器的開發人員工具中檢入響應代碼，並確保網址正確無誤。
希望這可以幫助！
解決方案3
0 2015-07-11 20:21:13
我遇到了同樣的問題，我糾正了相對路徑，以從與頁面相同的文件夾開始，並且可以正常工作：url（./ images / 1.jpg）而不是url（/images/1.jpg），我在某個地方讀得更好總是這樣做。 讓我知道它是否有效。
解決方案4
0 2015-07-28 20:13:18
對我來說，這是因為我正在使用角度元素指令設置背景，但是我忘記將“顯示”設置為“塊”。 啊! 我花了很多時間來解決這個問題！ 如果這是一個屬性指令，我可能不會遇到這個。
解決方案5
0 2019-07-19 17:05:42
實際上，我遇到了同樣的問題。 解決方案就在這里。 您必須更改路徑background-image: url('/ximages/websiteheader1.png') ; 到background-image: url('ximages/websiteheader1.png') ;
實際上，從圖像路徑中刪除第一個/ 。
背景圖像沒有顯示在 div 中？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.