爲什麼我的背景圖片不顯示？

我遇到了麻煩背景圖像在一個div顯示和不能爲我的生活爲什麼...爲什麼我的背景圖片不顯示？

這是我的結構：

Folder 
     \style.css 
     \index.html 
     \Images 
      \bookone.jpg

我想bookone.jpg文件是div的背景。因此，CSS路徑將是Folder/style.css，圖像路徑是Folder/Images/bookone.jpg。我在我的html和css文件中有下面的代碼，但是在預覽它時什麼都沒有。

/* CSS */ 
 

 
.book { 
 
    height: 300px; 
 
    width: 300px; 
 
    margin: 0px; 
 
    padding: auto; 
 
    border: 1px solid #000; 
 
} 
 

 
#bookone { 
 
    background: url(..\Images\bookone.jpg) ; 
 
    background-repeat: no-repeat; 
 
    background-position: center; 
 
    background-size: cover; 
 
}

<!-- HTML --> 
 

 
<div id="bookone" class="book"></div>

來源

2016-11-05 Mark R

你應該用斜槓（/）而不是反斜線（\）。還有 - 確保圖像處於正確的路徑（相對於當前的css/html文件）。 – Dekel

如果我複製完整的文件路徑應該工作？ –

不，因爲在'windows'系統中完整的文件路徑使用正斜槓，而在html/css中你應該使用反斜槓（/）。 – Dekel

你應該使用斜槓（/）而不是反斜線（\）。
你應該確保圖像的路徑正確（相對於當前的css/html文件）。如果圖像存在於您的css文件（或您的html文件）的相同位置，則不應使用..，因爲它實際上會通知您的瀏覽器在上部文件夾中搜索該圖像。

這是最後的CSS代碼，你可能應該使用：

.book { 
    height: 300px; 
    width: 300px; 
    margin: 0px; 
    padding: auto; 
    border: 1px solid #000; 
} 

#bookone { 
    background: url(Images/bookone.jpg) ; 
    background-repeat: no-repeat; 
    background-position: center; 
    background-size: cover; 
}

來源

2016-11-05 03:46:29 Dekel

只是寫的答案我的意見，因爲這有助於OP來解決這個問題

嘗試url(Images/bookone.jpg)在烏爾css文件

來源

2016-11-05 03:36:04 Rahul

它看起來像你想有作爲圖像背景位於遠離CSS位置的另一個文件夾中。我建議你從HTML代碼中分配背景圖片。使用正斜槓（/）而不是反斜槓（\）。

E.G

<div id="bookone" class="book" style="background: (url('/myimage/bg.jpg')"></div>

或CSS

.book { 
    height: 300px; 
    width: 300px; 
    margin: 0px; 
    padding: auto; 
    border: 1px solid #000; 
} 

#bookone { 
    background: url(./images/bookone.jpg) ; 
    background-repeat: no-repeat; 
    background-position: center; 
    background-size: cover; 
}

來源

2016-11-05 03:38:26

爲什麼我的背景圖片不顯示？

回答

相關問題