2014-09-01 229 views
-4

我想在我的主題中放置一個分隔符。我正在使用圖像作爲分隔符。但圖像沒有顯示出來。下面是代碼:CSS背景圖片顯示不正確

在index.php文件我已經包括了(只是循環的結束前):

<?php 
    if (($wp_query->current_post + 1) < ($wp_query->post_count)) { 
     echo '<div class="post-item-divider">&nbsp Post Divider</div>'; 
    } 
?> 

的CSS:

.post-item-divider { 
    background-image: url("/images/capture.png"); 
    height: 50px; 
    line-height:1px; 
    width:100%; 
    margin-bottom:20px; 
} 

但圖像沒有顯示。然而文本:div中出現「Post Divider」。我試圖用web中的url替換圖片url,它工作正常。

+0

你的文件夾是如何組織的? – 2014-09-01 17:01:56

+1

如果你可以改變URL爲不同的東西,那麼你的代碼就沒問題。問題可能是文件路徑不正確。拼錯了,或者什麼的。 – durbnpoisn 2014-09-01 17:02:04

+0

確保網址正確... – 2014-09-01 17:02:15

回答

-1

這意味着你的CSS屬性: background-image:url(「/ images/capture.png」); 路徑不正確將其替換爲 background-image:url(「../ images/capture.png」); 嘗試通過螢火蟲或檢查它。

+0

儘管我同意url是與樣式表的源相關的,但在瀏覽器中測試它並不會對你有多大幫助。在firebug/codeinspector中設置一個相對URL只有在資源已經加載時才起作用(至少在我的經驗中)。 – itd 2014-09-01 17:46:39

0

通過看你的代碼,我猜你正在使用wordpress。無論如何,確保你有正確的形象路徑。

如果遠程URL與此代碼正常工作,我相信url是錯誤的。確保圖像在上述路徑中可用。

0

問題出在了url的相對路徑上。它應該是:images/capture.png。

我無法刪除該問題,因爲它已被其他人回答。