Style listStyle 属性

Style 对象参考手册 Style 对象

定义和用法

listStyle 属性以速记形式设置或返回三个独立的列表属性。

通过该属性，您可以设置/返回：

  • list-style-type
  • list-style-position
  • list-style-image

语法

设置 listStyle 属性：

Object.style.listStyle = "type position image"

返回 listStyle 属性：

Object.style.listStyle

提示：listStyle 属性的默认值是 "disc outside none"。

参数 描述
type 定义列表项标记的类型。
position 对列表项标记进行定位。
image 定义图像为列表项标记。
inherit listStyle 属性的值从父元素继承。

浏览器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

所有主要浏览器都支持 listStyle 属性。

注意：IE7 及更早的版本不支持 "inherit" 值。IE8 只有规定了 !DOCTYPE 才支持 "inherit"。IE9 支持 "inherit"。

实例

更改列表的样式：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>蜜蜂教程(mifengjc.com)</title>
  <script>
    function displayResult() {
      document.getElementById("ul1").style.listStyle = "decimal inside";
    }
  </script>
</head>
<body>

  <ul id="ul1">
    <li>Coffee</li>
    <li>Tea</li>
    <li>Water</li>
    <li>Soda</li>
  </ul>
  <br>
  <button type="button" onclick="displayResult()">修改列表style</button>

</body>
</html>

尝试一下 »

Style 对象参考手册 Style 对象