::marker伪元素可用于自定义列表符号的颜色、大小及内容，支持有序和无序列表；通过color和font-size改变外观，content配合counter修改编号格式或替换符号，但仅限有限样式属性，复杂效果需结合::before实现。
使用 CSS 的 ::marker 伪元素可以轻松自定义列表项前的符号，比如改变颜色、大小或替换为自定义内容。这对于有序列表（ol）和无序列表（ul）都有效，但支持的样式属性有限，主要适用于修改标记本身的外观。
改变列表符号的颜色和大小
::marker 最常见的用途是调整列表标记的颜色和字体大小，而不影响列表项文本。
// 示例：将所有 li 的标记改为红色，并增大字号
li::marker {
color: red;
font-size: 1.2em;
}
自定义有序列表的数字样式
你可以用 content 配合 counter() 来完全控制有序列表的编号格式。
// 示例：在数字前后添加括号
ol li::marker {
content: "(" counter(list-item) ") ";
color: blue;
}
这会把原本的 "1." 变成 "(1)"，并应用蓝色。
立即学习“前端免费学习笔记（深入）”；
使用自定义符号替代默认圆点
对于无序列表，可以用 content 替换默认的圆点为其他字符或符号。
// 示例：用箭头代替项目符号
ul li::marker {
content: "> ";
color: green;
}
注意：这种方法不能插入图片，仅支持字符串或 Unicode 字符。
限制与注意事项
::marker 能设置的 CSS 属性较少，只支持：
- color
- content
- font属性（font-size, font-weight 等）
- text-combine-upright
- white-space
- unicode-bidi
不支持 background、padding、margin 等布局属性。如果需要更复杂的效果（如图标、背景色块），建议使用 ::before 伪元素配合 display: list-item 或取消默认列表样式后手动实现。
基本上就这些，::marker 提供了简洁的方式来美化列表标记，适合轻量级定制。对于高级需求，可结合其他方法灵活处理。
