list-style: none 不生效最常见原因是选择器权重不足或被更高优先级规则覆盖，如.card-body中list-style: disc、嵌套ul未被重置、list-style-image残留；需作用于ul/ol根元素，配合padding重置并检查computed样式。
直接用 list-style: none 覆盖，别依赖 list-unstyled —— 它会连缩进和间距一起干掉，容易破坏布局。
为什么 list-style: none 有时不生效
最常见的是选择器权重不够或继承干扰：.card-body 里可能有更高优先级的 list-style: disc；.list-group-item 内部嵌套的 <ul> 不会被父级样式自动重置；还有旧项目用了 list-style-image，只设 list-style: none 才能一并清除。
建议做法：
- 加自定义 class（比如
no-bullets），避免全局污染 - 检查是否漏写了
list-style-type和list-style-image - 在浏览器开发者工具里看 computed 样式，确认哪条规则在起作用
list-unstyled 真正干了什么
它不只是去圆点，而是清空整套默认列表视觉：移除 list-style、清掉 padding-left（对 <ul>）、抹掉 margin-top/margin-bottom。这意味着列表项会紧贴左边界、上下紧凑排列。
典型误用场景：
- 导航菜单里盲目加
list-unstyled，结果子菜单项挤在一起，点击热区变小 - 把类加在
<li>或外层<div>上——完全无效，必须加在<ul>或<ol>根元素上 - 和
list-inline混用时没处理好margin-right: 0.5rem，导致横向间距失控
内联列表（list-inline）要不要额外处理
list-inline 默认已含 list-style: none，但它还做了两件事：把 <li> 设为 display: inline-block，并加了 margin-right: 0.5rem。如果你只是想水平排列但保留圆点（极少见），就不能用它，得自己写 display: inline-flex 或 flex 布局。
注意：list-inline 在 Bootstrap 5 中对 <ol> 无效，只适配 <ul>；若需序号+横排，得手动配合 counter-reset 和伪元素。
真正要小心的不是“怎么去掉圆点”，而是“去掉之后缩进和间距还在不在”。很多布局错位问题，根源都在 list-unstyled 把 padding-left 一并清掉了，却没人补回来。
