前端之旅

在做清單時，當我們使用<ul><li>做：

HTML：

輸入這段程式碼後，呈現如下：

一、類型

１．拿掉清單前面的圓點：

CSS：

ul {

list-style: none;

}

２．將清單前面的圓點 → 改為「空心圓點」：

CSS：

ul {

list-style-type: circle;

}

３．將清單前面的圓點 → 改為「方形」：

CSS：

ul {

list-style-type: square;

}

４．將清單前面的圓點 → 改為「大寫英文字母」：

CSS：

ul {

list-style-type: upper-alpha;

}

５．將清單前面的圓點 → 改為「小寫英文字母」：

CSS：

ul {

list-style-type: lower-alpha;

}

６．將清單前面的圓點 → 改為「大寫羅馬字」：

CSS：

ul {

list-style-type: upper-roman;

}

７．將清單前面的圓點 → 改為「小寫羅馬字」：

CSS：

ul {

list-style-type: lower-roman;

}

８．將清單前面的圓點 → 改為「阿拉伯數字」：

CSS：

ul {

list-style-type: decimal;

}

９．將清單前面的圓點 → 改為「十進制阿拉伯數字」：

CSS：

ul {

list-style-type: decimal-leading-zero;

}

１０．將清單前面的圓點 → 改為「希臘語」：

CSS：

ul {

list-style-type: lower-greek;

}

二、位置

１．縮排

CSS：

ul {

list-style-type: lower-greek;

list-style-position: inside;

}

２．凸排

CSS：

ul {

list-style-type: lower-greek;

list-style-position: outside;

}