圖標沒有顯示在我的項目符號旁邊？

我有一個網頁，我正在設計，我試圖讓圖標作爲項目符號出現在文本前面。相關代碼如下：圖標沒有顯示在我的項目符號旁邊？

CSS文件：

.content .bullets { 
    float: left; 
} 

.content .bullets { 
    margin: 5px 0; 
    color: #555; 
    font-weight: 500; 
    text-shadow: 0 1px 1px #fff; 
    width: 400px; 
} 

.content .bullets ul { 
    margin: 0; 
    padding: 0 0 0 5px; 
    list-style: none; 
} 

.content .bullets ul li { 
    padding: 0 0 10px 25px; 
    font-size: 18px; 
    color: #4675b5; 
} 

/* icons */ 
.connect_ico {background: url(/images/Apartment Favicon.png) 0 5px no-repeat;} 
.impress_ico {background: url(/images/resume favicon.png) 0 5px no-repeat;} 
.living_ico {background: url(/images/ThumbsUp Favicon.png) 0 5px no-repeat;}

的index.html：

<div class="bullets"> 
      <ul> 
       <li class="connect_ico">Example text......</li> 
       <br> 
       <li class="impress_ico">Example Text.....</li> 
       <br> 
       <li class="living_icon">Examples Text......</li> 
      </ul> 
     </div>

顯然，這些都只是代碼片段，但我認爲他們是相關作品。我已將這些圖像上傳到FTP服務器上的圖像目錄，並使用Cyberduck（在Mac上）。

謝謝你的幫助。

來源

2011-12-14 user1072337

您肯定需要刪除.png圖像中的空格。您也可以通過創建一個<ul>，並使用CSS來取代子彈在列表中的圖像做在一個更簡單的方法：

ul { 
list-style-image: url(images/ThumbsUpFavicon.png);

}

來源

2011-12-14 02:12:17

嘗試在圖像網址的開頭刪除/。這是一條絕對路徑，你可能想要親戚。此外，空間可能需要通過反彈逃脫，如下所示：foo\ bar.png

來源

2011-12-14 02:05:50

謝謝邁克爾，在圖像名稱空間是問題。我刪除這些後，他們顯得很好。 – user1072337 2011-12-14 16:51:43

圖標沒有顯示在我的項目符號旁邊？

回答

相關問題