CSS list-style-image 語法
list-style-image:url(' 要顯示的圖片檔案位置 ');
語法中的 url 括號內放入要顯示的圖片檔案位置，可以是同一台伺服器上的圖檔，也可以引入外部圖檔，若為同一網站根目錄下的圖檔，可以使用簡化的 url 位置，但若是不同伺服器的外部圖檔，則必須使用完整的圖片網址，否則無法顯示圖片，只會顯示原始項目符號。
CSS list-style-image 範例
<style type="text/css">
ul li {
list-style-image:url('upload/20130930173146.gif');
}
</style>
<ul>
<li>Test list style image A.</li>
<li>Test list style image B.</li>
<li>Test list style image C.</li>
</ul>
以上範例輸出結果如ul li {
list-style-image:url('upload/20130930173146.gif');
}
</style>
<ul>
<li>Test list style image A.</li>
<li>Test list style image B.</li>
<li>Test list style image C.</li>
</ul>
- Test list style image A.
- Test list style image B.
- Test list style image C.
| 參數 | 定義 |
| url | 引用圖檔取代原本的項目符號，亦為 list-style-image 最主要功能。 |
| none | 不顯示圖片，僅顯示原始項目符號，此為預設值。與不用 list-style-image 同樣意思。 |
| inherit | 繼承自父層的規則，IE9 才開始支援，舊版 IE 不支援，不太建議使用。 |
若不需要圖片式項目符號，僅需圖形式項目符號，可以使用：CSS list-style-type。
使用 list-style-image 需要注意引用的圖片是否可以正確顯示，尤其是引用外部圖片的時候，要確認該圖檔是否可外連，以免發生自己的電腦看起來沒問題，換一台電腦就看不到圖檔的窘境。最重要的是，引用圖片不能夠使用未經授權的圖片，網路的世界也需要彼此尊重。
相關主題研究