可以一次設定 list-style-image, list-style-position, list-style-type 三個參數。個別的設定值請參考後面的說明。此特徵可設為：
- list-style-image, list-style-position, list-style-type 的組合。
- inherit：繼承父元素的特徵值。
設定項目單的標誌的圖像檔案的網址，可設為：
- <URI>：標誌的圖像檔案的網址。
- nono：沒有標誌，此為預設值。
- inherit：繼承父元素的特徵值。
- 風格用法：
<ul style='list-style-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisusG9Gxvhb9HT3WDSKFsiW_cEXy1nTaztMKzvjoq8hhXesJiyqD2aABdrIwLSTjLnGQprkM3tmU7ywgAqdlWajZIDPnxLV3sDB23pJAY7xpHdoCUZ9i-tRWRnjYidYBivnoCmjxkB62yg/s200/ant.GIF") '>
<li>賽車遊戲。
<li>網路遊戲。
<li>空戰遊戲。
</ul> - 執行結果：
- 賽車遊戲。
- 網路遊戲。
- 空戰遊戲。
設定標誌矩形格子相對於主矩格的位置，可設為：
- indise：標誌放在主矩格之內的第一個位置，其它內容接在其後。
- outside：標誌放在主矩格之外，此為預設值。
- inherit：繼承父元素的特徵值。
- 風格用法：
<style type='text/css'>
.cls LI { background:#733; width:300px }
</style>
<div class='cls'>
<ul style="list-style: inside lower-greek">
<li>射擊遊戲。
<li>遊戲天堂。
<li>小遊戲。
</ul><br />
<ol style="list-style: outside georgian">
<li>巴哈姆特。
<li>益智遊戲。
<li>無名小站。
</ol>
</div> - 執行結果：
- 射擊遊戲。
- 遊戲天堂。
- 小遊戲。
- 巴哈姆特。
- 益智遊戲。
- 無名小站。
設定項目單的標誌，以 list-style-image 為優先。可設為：
- disc, circle, square, decimal, decimal-leading-zero, lower-roman, upper-roman, lower-greek, lower-alpha, lower-latin, upper-alpha, upper-latin, hebrew, armenian, georgian, cjk-ideographic, hiragana, katakana, hiragana-iroha, katakana-iroha：可設定為各種形狀的標誌，或不同語言的數字，或不同語言的字母。預設值為 disc。部分瀏覽器沒有完全支援這些項目，尤其是舊版本的瀏覽器。
- none：沒有標誌。
- inherit：繼承父元素的特徵值。
- 風格用法：
<style type='text/css'>
.fst BR {clear:both}
.typ LI {list-style-position:inside; float:left}
</style>
<ol class=fst>
<li>disc（實心圓）
<ol class=typ style='list-style-type: disc'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>circle（空心圓）
<ol class=typ style='list-style-type: circle'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>square
<ol class=typ style='list-style-type: square'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>decimal
<ol class=typ style='list-style-type: decimal'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>decimal-leading-zero
<ol class=typ style='list-style-type: decimal-leading-zero'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>lower-roman
<ol class=typ style='list-style-type: lower-roman'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>upper-roman
<ol class=typ style='list-style-type: upper-roman'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>lower-greek
<ol class=typ style='list-style-type: lower-greek'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>lower-alpha
<ol class=typ style='list-style-type: lower-alpha'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>lower-latin
<ol class=typ style='list-style-type: lower-latin'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>upper-alpha
<ol class=typ style='list-style-type: upper-alpha'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>upper-latin
<ol class=typ style='list-style-type: upper-latin'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>hebrew
<ol class=typ style='list-style-type: hebrew'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>armenian
<ol class=typ style='list-style-type: armenian'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>georgian
<ol class=typ style='list-style-type: georgian'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>cjk-ideographic
<ol class=typ style='list-style-type: cjk-ideographic'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>hiragana
<ol class=typ style='list-style-type: hiragana'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>katakana
<ol class=typ style='list-style-type: katakana'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>hiragana-iroha
<ol class=typ style='list-style-type: hiragana-iroha'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
<li>katakana-iroha
<ol class=typ style='list-style-type: katakana-iroha'>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol><br /><br />
</ol> - 執行結果：
- disc（實心圓）
- circle（空心圓）
- square
- decimal
- decimal-leading-zero
- lower-roman
- upper-roman
- lower-greek
- lower-alpha
- lower-latin
- upper-alpha
- upper-latin
- hebrew
- armenian
- georgian
- cjk-ideographic
- hiragana
- katakana
- hiragana-iroha
- katakana-iroha
- disc（實心圓）
- IE6 沒支援；Firefox3.0, Safari, Chrome 都成功。
設定標誌矩格與主矩格的距離，要配合 display:marker 使用。主要瀏覽器都沒有支援此特徵。可設為：
- 長度：設定距離，可為負值。
- auto：系統決定，此為預設值。
- inherit：繼承父元素的特徵值。
:HOVER, :ACTIVE 的應用。使用時要注意，在 IE6 中 :HOVER, :ACTIVE 只能用在 ANCHOR 元素。
- 風格用法：
<style type='text/css'>
.hvr {list-style-type: upper-roman;
}
.hvr LI {list-style-position:inside;
float:left;
}
.hvr LI:hover {list-style-type: lower-greek;}
.hvr LI:active {list-style-type: cjk-ideographic;}
</style>
<ol class=hvr>
<li> <li> <li> <li> <li> <li> <li> <li> <li> <li> <li>
</ol>
<br clear=all> - 執行結果：
javascript 應用。可以用 style 物件 的特徵 listStyle, listStyleImage, listStylePosition, listStyleType 讀取或設定特徵值。
- 風格用法：
<ul style='list-style:inside decimal' id='lst'>
<li>測試
</ul>
<script type='text/javascript'>
var os=document.getElementById('lst').style;
document.write( os.listStyle
+'<br />'+ os.listStyleImage
+'<br />'+ os.listStylePosition
+'<br />'+ os.listStyleType );
</script> - 執行結果：
- 測試
initial
inside
decimal
- 不同瀏覽器的輸出結果有差異。
