📋 CSS列表样式生成器

⚙️ 列表样式设置

自定义列表标记的类型、颜色、大小和位置。

无序列表 (ul) 有序列表 (ol)
1.2em
16px
2

👁️ 实时预览

同时查看无序和有序列表的样式效果。

无序列表

    有序列表

      💻 CSS代码

      📖 CSS列表样式详解

      CSS列表样式使用 list-style 简写属性或其子属性:list-style-type(标记类型)、list-style-position(标记位置)和 list-style-image(标记图片)。

      ::marker伪元素

      ::marker 伪元素让你独立控制列表标记的样式,包括颜色、字体大小和字体族。例如:li::marker { color: #f59e0b; font-size: 1.5em; }。支持Chrome 86+、Firefox 68+、Safari 11.1+。

      CSS计数器

      使用 counter()counter-increment 可实现高级多级编号,如1.1、1.2、2.1,适用于文档大纲和法律条款。