我在我的 HTML 頁面中插入了一個背景圖像，但它沒有顯示
[英]I insert a background-image in my HTML page but it does not show
問題描述
我寫了下面的HTML代碼，插入了一張jpg圖片，但是為什么頁面渲染后圖片沒有出現？
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div.image { background-image: url("images/bg1.jpg"); } </style> </head> <body> <p class="text1">Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus, iste?</p> <div class="image"></div> <div class="text2">Lorem ipsum dolor sit amet.</div> </body> </html>
2 個解決方案
解決方案1
0 2021-11-01 21:28:43
根據這個答案，使用 CSS 可能會有所幫助： https : //stackoverflow.com/a/10833692/5968663
<style>
<div class="image"></div>
</style>
像這樣使用 CSS：
div.image {
content: url("images/bg1.jpg");
}
解決方案2
0 2021-11-05 08:38:58
默認情況下， div跨越其容器的整個寬度，但高度為零，除非其中有一些內容。 目前您的div.image高度為零。 為div.image指定一個高度，例如height: 100px或在其中放置一個子元素。
解決方案3
0 2021-11-05 08:42:04
你應該給HTML ， BODY和div.image一個min-height: 100vh ，那么你的背景圖片也應該是可見的。
如果你真的想讓它作為網站背景，你還應該設置position: absolute; top:0;left:0 position: absolute; top:0;left:0 。
當我使用 Chrome Lite 模式切換暗模式時，我的背景圖像不顯示
[英]My background-image doesn't show when I toggle dark mode with Chrome Lite Mode
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.