CSS list-style-image 屬性 · W3School CSS 參考手冊

# CSS list-style-image 屬性 ## 實例把圖像設置為列表中的項目標記： ``` ul { list-style-image:url("/i/arrow.gif"); list-style-type:square; } ``` ## 瀏覽器支持 | IE | Firefox | Chrome | Safari | Opera | | --- | --- | --- | --- | --- | 所有瀏覽器都支持 list-style-image 屬性。注釋：任何的版本的 Internet Explorer （包括 IE8）都不支持屬性值 "inherit"。 ## 定義和用法 list-style-image 屬性使用圖像來替換列表項的標記。 ### 說明這個屬性指定作為一個有序或無序列表項標志的圖像。圖像相對于列表項內容的放置位置通常使用 list-style-position 屬性控制。注釋：請始終規定一個 "list-style-type" 屬性以防圖像不可用。 | 默認值： | none | | --- | --- | | 繼承性： | yes | | --- | --- | | 版本： | CSS1 | | --- | --- | | JavaScript 語法： | _object_.style.listStyleImage="url('/images/blueball.gif')" | | --- | --- | ## 可能的值 | 值 | 描述 | | --- | --- | | _URL_ | 圖像的路徑。 | | none | 默認。無圖形被顯示。 | | inherit | 規定應該從父元素繼承 list-style-image 屬性的值。 | ## TIY 實例 [將圖像作為列表項標記](/tiy/t.asp?f=csse_list-style-image) 本例演示如何將圖像作為列表項標記。 ``` <html> <head> <style type="text/css"> ul { list-style-image: url('/i/eg_arrow.gif') } </style> </head> <body> <ul> <li>咖啡</li> <li>茶</li> <li>可口可樂</li> </ul> </body> </html> ``` ## 相關頁面 CSS 教程：[CSS 列表](/css/css_list.asp "CSS 列表") CSS 參考手冊：[CSS list-style 屬性](/cssref/pr_list-style.asp "CSS list-style 屬性") HTML DOM 參考手冊：[listStyleImage 屬性](/jsref/prop_style_liststyleimage.asp "HTML DOM listStyleImage 屬性")