CSS2.1 清單樣式(List)
list-style
| 屬性樣式 | 設定值 |
| list-style 清單樣式 |
list-style-image 之值 list-style-position 之值 list-style-type 之值 |
| 預設值:依個別特性而定 適用於:只能用在清單元素上 繼承性:有 |
|
這個樣式是用來同時(或視您所需)設定清單相關的樣式。
例如,在下面的樣式中,同時設定了清單標號圖片、清單項目位置、清單標號形式。
div.MyStyle {
list-style: url('/img/show.png') inside circle;
}
list-style-image
| 屬性樣式 | 設定值 |
| list-style-image 清單標號圖片 |
none url('圖片路徑與檔名') |
| 預設值:none 適用於:只能用在清單元素上 繼承性:有 |
|
這個樣式是用來將預設的清單項目符號改為使用我們所自訂的圖片。
div.MyStyle {
list-style-image: url('show.png');
}
list-style-position
| 屬性樣式 | 設定值 |
| list-style-position 清單項目位置 |
outside (項目符號在外側) inside (項目符號在內側) |
| 預設值:outside 適用於:只能用在清單元素上 繼承性:有 |
|
這個樣式是用來將清單的項目符號設在內容的外側或內側。
div.MyStyle {
list-style-position: inside;
}
list-style-type
| 屬性樣式 | 設定值 |
| list-style-type 清單標號形式 |
disc (實心圓)、circle (空心圓)、square (實心方形) decimal (阿拉伯數字) decimal-leading-zero (以 0 開頭的 10 進位數字) lower-alpha (小寫英文字母)、upper-alpha (大寫英文字母) lower-greek (小寫希臘字母) lower-latin (小寫拉丁字母)、upper-latin (大寫拉丁字母) lower-roman (小寫羅馬字母)、upper-roman (大寫羅馬字母) hiragana (日文 50 音–平假名) hiragana-iroha (古日文 47 音–平假名) katakana (日文 50 音–片假名) katakana-iroha (古日文 47 音–片假名) hebrew (希伯來數字) armenian (阿爾曼數字) georgian (喬治亞數字) cjk-ideographic (中文數字) none (無) |
| 預設值:disc 適用於:只能用在清單元素上 繼承性:有 |
|
這個樣式是用來改變清單的項目符號。
div.MyStyle {
list-style-type: cjk-ideographic;
}