最稳妥清空列表默认样式是 ul, ol { list-style: none; padding-left: 0; }，因 list-style: none 仅作用于 ul/ol，不作用于 li，且需重置 padding-left 才能彻底消除缩进。
怎么用 list-style 一键清空所有列表默认样式
直接设 list-style: none 是最常用也最稳妥的方式，它同时干掉项目符号、编号和缩进。但注意：它只作用于 <ul></ul> 和 <ol></ol> 元素本身，对 <li> 无效——所以别写成 li { list-style: none }，没用。
常见错误是顺手加 padding-left: 0 或 margin-left: 0，其实多数浏览器下 ul/ol 自带的缩进就是靠 padding-left 实现的，清空 list-style 后，往往还得手动重置这个 padding。
ul, ol { list-style: none; padding-left: 0; }- 如果用了
display: flex或display: grid布局，list-style会自动失效，此时不用额外清除 - 某些重置库（如 Normalize.css）已把
ul/ol的padding-left设为0，这时只写list-style: none就够了
用 :not() 排除某类 <li> 不清除样式
想保留某个特定 <li> 的原生样式（比如导航里只有“当前页”要带圆点），就得靠 :not() 配合属性或类选择器。关键点在于：必须选中父容器再排除子项，不能反过来。
错误写法：li:not(.keep) { list-style: none } —— 这会让所有 li 先继承父级的 list-style，再单独覆盖，容易受层叠顺序干扰。
立即学习“前端免费学习笔记（深入）”；
- 推荐写法：
ul.menu li:not(.keep) { list-style: none; } -
:not()里只能放简单选择器，不能写:not(li.keep)或:not(.keep:hover) - 如果目标是排除多个类，得用逗号分隔：
li:not(.keep):not(.active)，不能写成li:not(.keep, .active) - IE8 及以下不支持
:not()，需要兼容时得换 JS 或额外 class 控制
为什么不能只靠 all: unset 清列表样式
all: unset 看似一劳永逸，但它会把 ul 的 display 也重置成 inline，导致列表塌陷成一行，完全失去语义结构。这不是“清除样式”，是破坏布局。
-
all: unset会清掉margin、padding、list-style、display、甚至vertical-align - 真正安全的组合是：
list-style: none; padding: 0; margin: 0; - 如果连
display都想保持可控，显式写上display: block更稳
清除后内容对齐出问题？检查 text-align 和 line-height
清完样式后文字突然左飘、上下错位，大概率不是列表问题，而是父容器的 text-align 或 line-height 影响了 li 内联表现。特别是当 li 里混了图标、span 或 img 时，基线对齐会变乱。
- 给
ul加font-size: 0再给li单独设字号，能消灭 inline 元素间的空白间隙 -
li { vertical-align: top }比依赖默认基线更可控 - 用
flex替代纯文本流时，align-items: center通常比调line-height更可靠
