使用::marker可自定义有序列表编号样式，支持颜色、字体大小等属性调整，如设置深橙色加粗数字；content替换需谨慎，建议用counter配合::before实现复杂格式。
使用 css::marker 可以轻松自定义有序列表（
基本语法与作用
::marker 是一个伪元素，应用于 或其他可生成标记的元素，用来设置列表前面的编号或符号样式。
支持的 CSS 属性有限，主要包括：
- color：改变编号颜色
- content（部分浏览器支持）：替换标记内容
- font-size、font-weight：调整字体大小和粗细
- text-transform：控制大小写等文本变换
修改颜色和字体大小
可以直接通过 ::marker 改变默认数字的颜色和大小：
立即学习“前端免费学习笔记（深入）”；
ol li::marker {
color: #e64a19;
font-size: 1.2em;
font-weight: bold;
}
这样每个 前面的序号会变成深橙色并加大显示，视觉上更突出。
自定义计数内容（谨慎使用）
理论上可以使用 content 替换标记内容，但注意：在标准有序列表中修改 content 可能导致原有计数失效或行为异常。
eMart 网店系统
下载
功能列表：底层程序与前台页面分离的效果，对页面的修改无需改动任何程序代码。完善的标签系统，支持自定义标签，公用标签，快捷标签，动态标签，静态标签等等，支持标签内的vbs语法，原则上运用这些标签可以制作出任何想要的页面效果。兼容原来的栏目系统，可以很方便的插入一个栏目或者一个栏目组到页面的任何位置。底层模版解析程序具有非常高的效率，稳定性和容错性，即使模版中有错误的标签也不会影响页面的显示。所有的标
若需完全自定义标记内容（比如加前缀），建议结合 counter-reset 和 counter-increment 手动实现：
.custom-list {
counter-reset: section;
}
.custom-list li {
list-style: none;
}
.custom-list li::before {
counter-increment: section;
content: "Step " counter(section) ": ";
font-weight: bold;
color: #00695c;
margin-right: 8px;
}
这种方式虽然不用 ::marker，但能更好控制输出格式，适用于复杂场景。
注意事项与兼容性
::marker 目前在主流现代浏览器（Chrome、Firefox、Edge）中支持良好，但在一些旧版本或移动端可能受限。
使用时注意：
- 不能对 ::marker 设置浮动、定位偏移或复杂布局属性
- 不支持添加背景图或边框等装饰性样式
- 避免用它做计数逻辑，仅用于样式修饰
基本上就这些。对于大多数简单需求，直接用 ::marker 调整颜色、大小就很方便；如果要深度定制显示格式，推荐手动计数配合 ::before 实现。
