§ ITPOW >> 文档 >> CSS

CSS 列表的标识

作者:不详 来源: 日期:2002-8-5
这一节唯一我们将要讨论的是如何用 CSS 来改变列表 
前的标识。我们知道有两种列表:有序和无序。有序 
列表用阿拉伯数字为标识, 无序列表用黑色小圆圈来 
做标识。用 CSS 的 list-style-type 这两种列表的标 
识都可以有四种选择: 

无序: disc, circle, square, decimal
有序: upper-roman, lower-roman, upper-alpha, lower-alpha.

假如你想叫有序列表的标识为大小罗马字母 

  LI.upperroman {list-style-type: upper-roman}

[code]
  <STYLE>
    LI.upperroman {list-style-type: upper-roman}
    LI.lowerroman {list-style-type: lower-roman}
    LI.upperalpha {list-style-type: upper-alpha}
    LI.loweralpha {list-style-type: lower-alpha}
    LI.disc {list-style-type: disc}
    LI.circle {list-style-type: circle}
    LI.decimal {list-style-type: decimal}
    LI.square {list-style-type: square}
  </STYLE>
请看下面的比较
<table border=0 cellspacing=8 cellpadding=1 width=500>
<tr><td bgcolor=666666>
<table border=0 cellspacing=0 cellpadding=6 width=100% bgcolor=ffffcc>
<tr><td bgcolor="#FFFFCC">
<UL>
<LI class="disc">disc
<LI class="circle">circle
<LI class="square">square
<LI class="decimal">decimal
</UL>
</td></tr></table>
</td></tr></table>

<table border=0 cellspacing=8 cellpadding=1 width=500>
<tr><td bgcolor=666666>
<table border=0 cellspacing=0 cellpadding=6 width=100% bgcolor=ffffcc>
<tr><td bgcolor="#FFFFCC">
<OL>
<LI class="upperroman">大写罗马
<LI class="lowerroman">小写罗马
<LI class="upperalpha">大写字母
<LI class="loweralpha">小写字母
</OL>
</td></tr></table>
</td></tr></table>

</td>
</tr>
[/code]
相关文章