CSS @counter-style - 后缀

在@counter-style规则中，suffix描述符确定添加到标记表示末尾的内容。

可能的值

<symbol> - 它表示将后缀添加到标记表示的末尾。这可以是<string>、<image>或<custom-ident>。

语法

suffix = <symbol>

CSS 后缀 - 基本示例

以下示例演示了suffix描述符的用法。

<html>
<head>
<style>
   @counter-style Chapters {
      system: alphabetic;
      symbols: "a" "b" "c" "d" "e" "f" "g" "h" "i" "j";
      suffix: " ) ";
   }
   .demo-suffix {
      list-style: Chapters;
      font-size: 20px;
      padding-left: 15ch;
      color: blue;
   }
</style>
</head>
<body>
<ul class="demo-suffix">
   <li>CSS-Borders</li>
   <li>CSS-Unit</li>
   <li>CSS-Background</li>
   <li>CSS-Text</li>
   <li>CSS-Button</li>
   <li>CSS-Icons</li>
   <li>CSS-Selectors</li>
</ul>
</body>
</html>