[Back To Basic] CSS Lists

清單共2種

• 無序清單
• 有序清單

list-style-type

• 變更開頭的標記符號
• 有一些值是無序清單(<ul></ul>)專用，反之

list-style-image

指定圖片當作開頭的標記符號

list-style-position

• 指定開頭標記符號的位置
• outside(預設值，第二排文字對齊第一排文字)

list-style-type: none;

• 移除開頭標記符號
• <li></li>預設會有margin 和 padding，建議同時移除

list-style

• 簡寫: 將全部和 list-style 有關的屬性全部寫一起
• 順序為: list-style-type list-style-position list-style-image
• 如果有任一個沒填，會自動填入預設值

e.g.

list-style: square inside url("sqpurple.gif");

source code