CSS 列表樣式 list-style-type
list-style-type是指在CSS中不管是有序列表,還是無序列表,都統(tǒng)一使用list-style-type屬性來定義列表項(xiàng)符號(hào)。
在HTML中,type屬性定義列表項(xiàng)符號(hào),那是在元素屬性中定義的。但是不建議使用type屬性來定義元素的樣式。
在CSS中,不管是有序列表,還是無序列表,都統(tǒng)一使用list-style-type屬性定義列表項(xiàng)符號(hào)。
有序列表list-style-type屬性取值如下:
? none:無標(biāo)記
? disc:默認(rèn)。標(biāo)記是實(shí)心圓。
? circle:標(biāo)記是空心圓。
? square:標(biāo)記是實(shí)心方塊。
? decimal:標(biāo)記是數(shù)字。
? decimal-leading-zero: 0開頭的數(shù)字標(biāo)記(01、02、03等)。
? lower-roman:小寫羅馬數(shù)字(i、ii、iii、iv、v等)。
? upper-roman:大寫羅馬數(shù)字(I、II、III、IV、V等)。
? lower-alpha:小寫英文字母The marker is lower-alpha ( a、b、c、d、e等)。
? upper-alpha:大寫英文字母The marker is upper-alpha( A、B、C、D、E等)。
? lower-greek:小寫希臘字母(alpha、beta、gamma等)。
? lower-latin:小寫拉丁字母(a、b、c、d、e等)。
? upper-latin:大寫拉丁字母(A、B、C、D、E等)。
? hebrew: 傳統(tǒng)的希伯來編號(hào)方式。
? armenian:傳統(tǒng)的亞美尼亞編號(hào)方式。
? georgian: 傳統(tǒng)的喬治亞編號(hào)方式(an、ban、gan等)。
? cjk-ideographic:簡(jiǎn)單的表意數(shù)字。
?hiragana:標(biāo)記是a、i、u、e、o、ka、ki等(日文片假名)。
?katakana: 標(biāo)記是A、I、U、E、0、KA、KI等(日文片假名)。
?hiragana-iroha: 標(biāo)記是i、ro、ha、ni、ho、he、to等(日文片假名)。
?katakana-iroha: 標(biāo)記是I、RO、HA、NI、HO、HE、TO等(日文片假名)。
【例題】使用list-style-type屬性
代碼如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.ul{
list-style-type: decimal-leading-zero;
}
.o1{
list-style-type: lower-roman;
}
.u2{
list-style-type: uppear-alpha;
}
.o2{
list-style-type: hebrew;
}
</style>
</head>
<body>
<p>0開頭的數(shù)字標(biāo)記</p>
<ul>
<li>items1</li>
<li>items2</li>
<li>items3</li>
<li>items4</li>
</ul>
<hr/>
<p>小寫羅馬數(shù)字</p>
<ol>
<li>items1</li>
<li>items2</li>
<li>items3</li>
<li>items4</li>
</ol>
<hr/>
<p>大寫英文字母</p>
<ul>
<li>items1</li>
<li>items2</li>
<li>items3</li>
<li>items4</li>
</ul>
<p>傳統(tǒng)的希伯來編號(hào)方式</p>
<ol>
<li>items1</li>
<li>items2</li>
<li>items3</li>
<li>items4</li>
</ol>
</body>
</html>
點(diǎn)擊加載更多評(píng)論>>