CSS問題:(

Question

嘿：)我一直在努力為我們的網站做出一些不錯的懸停效果。 但是，當頁面加載時，它不會加載CSS-背景圖像，並且我們得到了一些奇怪的輕彈效果。 我已經嘗試了幾乎所有我認為的方法。 而且我們只是無法使其正常工作。 我將鏈接HTML和CSS來解決問題。

這是HTML，也是包含CSS的div。 該div位於主要內容div和內容div中。

<div class="produkt_links">
    <div id="produkt_7"><a href="produkt_1.html"></a></div>
</div>

CSS：

.produkt_links #produkt_7 a {
display: block;
width: 300px;
height: 290px;
background-image:url(../../images/mainpage%20links/arch_low.png);   
}

.produkt_links #produkt_7 a:hover {
background-image:url(../../images/mainpage%20links/arch_low_hover.png); 
}

PS。 我試過了精靈。 不起作用。 在Safari，Chrome和Firefox中試用過...

歡呼MM。

Answer 1

您需要更正所用（公共）資源的路徑

background-image:url(../../images/mainpage%20links/arch_low.png);

---

如果根文件夾是public_html ，則-

public_html
 > images
   > mainpage links
     > arch_low.png

然后用這個-

background-image:url("images/mainpage%20links/arch_low.png");

Answer 2

您還沒有編寫其他代碼，但是我建議您首先嘗試應用在CSS中不是圖像的內容。 例如：

.produkt_links #produkt_7 a {
display: block;
width: 300px;
height: 290px;
color: blue;   
}

.produkt_links #produkt_7 a:hover {
    color:red; 
}

如果這不起作用，請檢查CSS文件是否正確鏈接到HTML文件。

否則，請檢查服務器上映像的路徑是否正確。