list-style-type属性用于设置列表项标记类型，disc表示实心圆，是无序列表默认值；circle为空心圆，square为实心方块，none则隐藏标记但不消除缩进。
list-style-type 是最直接控制列表项符号类型的 CSS 属性，但它只负责“选型”，不负责“画图”或“精确定位”。想靠它实现图标、颜色变化、SVG 或带前缀的编号，会立刻碰壁。
哪些值能直接用，哪些其实不靠谱
list-style-type 的取值分两类：浏览器原生支持的和名义支持但实际渲染不可靠的。
-
disc、circle、square（无序）和decimal、lower-alpha、upper-roman（有序）在所有现代浏览器中表现稳定 -
cjk-ideographic、georgian、armenian等国际化类型，Chrome 和 Firefox 基本支持，但 Safari 在某些版本中会回退为decimal，别在关键路径上依赖 -
none看似简单，但要注意：它只是隐藏符号，li的缩进仍由默认margin-left或padding-left控制，常导致文本左对齐错乱
为什么 list-style-type: square 有时看起来不像方块
这不是 bug，是字体和渲染引擎共同作用的结果。不同系统（Windows/macOS/iOS/Android）内置字体对 square 的 glyph 实现不一致，有的偏小、有的偏细、有的甚至被截断。
- macOS 上
square常显示为浅灰色小方点，远不如disc醒目 - 移动端 WebView（尤其旧版 Android）可能把
square渲染成空心或半透明 - 解决方案不是换值，而是绕过它：设
list-style-type: none，再用::before插入content: "■"，字体可控、大小可调、颜色可设
有序列表编号被截断？检查 list-style-position
默认 list-style-position: outside 会让数字“挂”在行框外，当 li 行高小或容器窄时，高位数字（如 100+）容易被裁切。
立即学习“前端免费学习笔记（深入）”；
- 改用
list-style-position: inside可让数字进入文本流，避免裁剪，但会破坏原有缩进逻辑，需手动重设padding-left - 更稳妥的做法是保持
outside，给ol加padding-left: 2em并配合text-indent: -1em微调对齐 - 若要加括号（如 “1.”、“2.”），
list-style-type本身不支持，必须用 CSS 计数器 +::before
::marker 听起来先进，但别急着用
ul li::marker { content: "→"; color: #007acc; } 这种写法确实简洁，但兼容性仍是硬伤：
- Firefox 自 68+ 支持，Chrome 99+ 开始支持，Safari 直到 17.4 才完整支持（2024 年中才落地）
- 无法设置
font-family（多数浏览器忽略），也不能用background或transform - 最麻烦的是：它不能和
list-style-image共存，一旦用了图片符号，::marker就失效
真要跨浏览器稳定自定义，list-style-type: none + li::before 仍是当前最可靠的选择——控制粒度细、调试直观、兼容性覆盖到 IE11（只要不用 flex 定位）。
