HTML | DOM 样式 listStyle 属性

简介

listStyle 属性设置列表项标记的样式。

listStyle 属性在 CSS 中也存在。

在 HTML DOM 中，listStyle 属性是作为一部分的 Style 对象提供的。

语法

element.style.listStyle="circle inside";

属性值

属性值|描述 -|- none | 默认值。无标记。 disc | 用实心圆作为标记。 circle | 用空心圆作为标记。 square | 用实心方块作为标记。 decimal | 用数字作为标记。 decimal-leading-zero | 用 0 填充数字开头，直到数字有两位数。 lower-roman | 用小写罗马数字作为标记。 upper-roman | 用大写罗马数字作为标记。 lower-greek | 用小写希腊字母作为标记。 lower-latin | 用小写拉丁字母作为标记。 upper-latin | 用大写拉丁字母作为标记。 lower-alpha | 用小写字母作为标记。 upper-alpha | 用大写字母作为标记。

以上属性值可以通过在其前面添加 inside 或 outside 来控制标记位置。例如，circle inside 可以使得被标记的文字围绕一个实心圆。

示例

下例展示了如何设置列表项标记为数字。

<ol>
  <li>菜单项 1</li>
  <li>菜单项 2</li>
  <li style="list-style:decimal;">菜单项 3</li>
</ol>

我们可以看到，“菜单项 1”和“菜单项 2”的标记均为默认的样式，而“菜单项 3”的标记则是数字 3。

参考文献

• w3school-listStyle
• MDN-listStyle