list-style-type

优质

小牛编辑

127浏览

2023-12-01

描述 (Description)

list-style-type属性设置列表项的标记中使用的计数（或项目符号）样式。

可能的值 (Possible Values)

以下是可用于无序列表的值 -

Sr.No.	价值和描述
1	none NA
2	disc (default) 一个填充的圆圈
3	circle 一个空的圆圈
4	square 一个填充的广场

以下是可用于有序列表的值 -

值	描述	例
decimal	Number	1,2,3,4,5
decimal-leading-zero	数字前面的0	01, 02, 03, 04, 05
lower-alpha	小写字母数字字符	a, b, c, d, e
upper-alpha	大写字母数字字符	A, B, C, D, E
lower-roman	小写罗马数字	i, ii, iii, iv, v
upper-roman	大写罗马数字	I, II, III, IV, V
lower-greek	标记是低希腊语	alpha, beta, gamma
lower-latin	标记是低拉丁语	a, b, c, d, e
upper-latin	标记是上拉丁语	A, B, C, D, E
hebrew	标记是传统的希伯来语编号
armenian	标记是传统的亚美尼亚编号
georgian	标记是传统的格鲁吉亚编号
cjk-ideographic	标记是简单的表意数字
hiragana	标记是平假名	a, i, u, e, o, ka, ki
katakana	标记是片假名	A, I, U, E, O, KA, KI
hiragana-iroha	标记是平假名 - iroha	i, ro, ha, ni, ho, he, to
katakana-iroha	标记是片假名 - iroha	I, RO, HA, NI, HO, HE, TO

适用于 (Applies to)

所有元素都显示列表项。

DOM语法 (DOM Syntax)

object.style.listStyleType = "decimal"

例子 (Example)

这是一个例子 -

<html>
   <head>
   </head>
   <body>
      <ul style = "list-style-type:circle;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ul>
      <ul style = "list-style-type:square;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ul>
      <ol style = "list-style-type:decimal;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ol>
      <ol style = "list-style-type:lower-alpha;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ol>
      <ol style = "list-style-type:lower-roman;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ol>
   </body>
</html>

这将产生以下结果 -