去掉li的float即可恢复列表标记，因浮动使li脱离文档流导致浏览器跳过外边距区域的标记绘制；若需横排，应改用flex布局而非float。
列表标记“消失”不是样式没生效，是浮动让浏览器压根不渲染它了——直接删掉 float 最省事；非要保留浮动，就得手动补标记或换布局方式。
为什么给 li 加 float 后圆点/数字就没了
因为 list-style 的标记（比如 ● 或 1.）默认画在 li 的外边距区域，而一旦 li 浮动，它就脱离文档流，浏览器会跳过这块区域的绘制逻辑。这不是优先级问题，也不是兼容性问题，是浮动本身的渲染机制决定的。
- 哪怕你写了
list-style-position: inside，对浮动li也完全无效 - 父
ul如果没清浮动，还会高度塌陷，进一步掩盖问题 - 开发者常反复加
list-style: disc，其实只是白忙活
list-style-position: outside 是最快止损方案
这是浏览器默认值，不用额外写也能生效。但前提是：别让 li 浮动——只要去掉 float，标记立刻回来。
- 如果之前强制写了
list-style-position: inside，删掉它就行 - 确保
ul有合理padding-left（比如2rem），否则标记可能被裁切或挤到视口外 - 不要用
margin-left替代padding-left，它对标记定位没作用
真要横排又不想丢序号？别用 float，改用 flex
横排列表的本质需求是行内布局，float 是为图文混排设计的，强行用于菜单、标签栏副作用多、可访问性差。
- 推荐写法：
ul { display: flex; }+li { margin-right: 16px; }，list-style完全保留 - 兼容老浏览器可用
li { display: inline-block; vertical-align: top; }，注意 HTML 空格会留缝隙 - 用
flex后，list-style-position: inside表现稳定，不会被挤跑
实在没法动结构？只能手动模拟标记
极少数遗留项目必须用 float 又得显示圆点，那就放弃原生 list-style，自己造：
- 先写死
li { list-style: none; }，防止干扰 - 用
li::before { content: "• "; margin-right: 8px; }插入符号 - 若需有序列表，别依赖
counter()（浮动后顺序可能错乱），建议用数据属性或 JS 控制 - 伪元素默认是
inline，li高度不一致时，可能需要加vertical-align: top
真正容易被忽略的是：标记是否可见，表面看是 list-style-position 或 padding-left 的问题，根因其实是浮动破坏了 BFC，导致浏览器无法确定该在哪画标记。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
