有背景圖像沒有顯示的問題

我的背景圖像沒有顯示，它讓我瘋狂，因爲我知道這很容易。有背景圖像沒有顯示的問題

下面的div類是我試圖讓背景顯示的地方。

.sun-face{ 
    background-image: url("./images/Sun_face.svg"); 
} 


<div class="sun-face"></div>

我的文件目錄結構像這樣。

ROOT 
    -css 
    -fonts 
    -images 
    -js 
    index.html 
    navbar.html 
    signin.html

來源

2014-04-08 Adam Kolinski

試試這個background-image：url（「images/Sun_face.svg」）; –

我試過沒有運氣:( –

.sun-face {}可以在index.html文件中出現。對吧？ –

使用這個CSS

.sun-face{ 
background-image: url("../images/Sun_face.svg"); 
height:500px; 
}

來源

2014-04-08 04:04:12

我添加它作爲內聯樣式它的工作，但如果我在它的CSS它它沒有 –

index，css，圖像與目錄結構處於同一級別，所以如果你使用線條樣式「images/Sun_face.svg」，如果使用CSS樣式表，那麼你就需要使用「../images /Sun_face.svg「以滿足目錄層次結構 – Strikers

我以前有過這個問題，它是由一個MIME類型的服務器問題引起的。基本上服務器沒有配置爲服務.svg文件。檢查你的控制檯，一般情況下，如果是這種情況，你會看到像'資源解釋爲圖像，但傳輸與MIME類型...'。這可以通過在服務器上添加幾行.htaccess文件來解決。看到這個css-tricks article。

來源

2014-04-08 03:55:34

所以我增加了它的內嵌樣式表，

這個工作，但是我想在我的CSS文件

<style> 
    .sun-face{ 
     background-image: url("./images/Sun_face.svg"); 
     height:500px; 
     width:100%: 
    } 
    </style> 


<link href="./css/custom.css" rel="stylesheet">

我把它放在^^不起作用？

來源

2014-04-08 04:13:47

試試這個'background-image：url（」../ images/Sun_face.svg「）;'。你缺少一個「。」，檢查圖像的網址。 – James

將以上內容添加到您的css文件中 – James

感謝上帝，.sun-face背景圖片：url（「../ images/Sun_face.svg」）; height：500px; } –

有背景圖像沒有顯示的問題

回答

相關問題