list-style-type 用 decimal、lower-alpha 等值控制序号类型，但需注意兼容性差异；ul 默认 disc，ol 默认 decimal；带点序号需配合 list-style-position: outside；中文慎用非标准值。
list-style-type 怎么设置数字或字母序号
直接用 list-style-type 控制序号类型，但要注意不同值在不同浏览器下的默认行为差异。比如 decimal-leading-zero 在 safari 里不支持，lower-greek 在 chrome 中渲染为希腊字母，firefox 可能回退成英文字母。
常用安全值（兼容性好）：none、disc、circle、square、decimal、lower-alpha、upper-roman。
-
ul默认用disc，改circle或square更易区分嵌套层级 -
ol默认是decimal，若要「1.」「2.」带点，得配合list-style-position: outside（否则点可能被截断） - 中文场景慎用
simp-chinese-informal等，仅 Firefox 支持，且语义模糊
list-style-image 替换符号时为什么图片不显示
常见原因是路径错误或尺寸失控。list-style-image 指定的图片会原尺寸渲染，不自动缩放，也不受 font-size 影响，很容易撑破行高或错位。
- 优先用
background-image+::marker（现代方案），更可控 - 若坚持用
list-style-image，确保路径相对于 css 文件位置，不是 html 页面 - 图片宽高建议 ≤ 16px，否则需手动调
line-height和padding-left对齐 - IE 完全不支持该属性，必须降级到
list-style-type
::marker 伪元素怎么自定义列表前缀样式
::marker 是目前最灵活的方式，能单独控制序号颜色、字体、间距，且支持部分 CSS 属性（如 color、font-weight、content），但不支持 display 或 margin。
立即学习“前端免费学习笔记（深入）”；
- 给序号加颜色：
li::marker { color: #3a86ff; } - 替换内容（仅限
ol）：ol li::marker { content: "▶ " counter(list-item) ". "; } - 注意：Firefox 目前不支持
content中的counter()函数，Chrome/edge 可用 - 不能用
::marker给ul自定义符号形状（如三角形），仍得靠background-image
list-style 简写属性容易漏掉哪个关键细节
list-style 是 list-style-type、list-style-position、list-style-image 的简写，但它的重置逻辑很隐蔽：只要写了任意一个值，其他两个就会被强制设为默认值（list-style-type: disc、list-style-position: outside、list-style-image: none）。
- 例如只写
list-style: inside;，实际等价于list-style: disc inside none;，会意外覆盖已设的list-style-image - 想保留图片又调位置？必须显式写出全部：
list-style: url(arrow.svg) inside; - 用简写时建议始终带上
list-style-type值，避免依赖浏览器默认
真正难的不是选哪个属性，而是理解它们的层叠关系和浏览器实现差异——特别是 ::marker 和 list-style-image 在缩放、打印、高对比度模式下的表现，往往上线后才暴露。