li加float导致列表标记消失，根本原因是浮动使li脱离文档流，浏览器跳过外边距区域（标记绘制处）；修复首选flex布局或inline-block，其次检查ul默认padding-left被重置问题，必要时用伪元素模拟标记。
li加了float为什么列表标记就没了
不是样式没生效，是浏览器压根不渲染标记区域。list-style的圆点或数字默认画在li的外边距区域，而float让li脱离文档流，这块区域被跳过——你反复写list-style: disc或list-style-position: inside都没用。
最快修复：删掉float，换flex或inline-block
横排列表根本不需要浮动，改用现代布局方式既保留标记又省心：
-
ul { display: flex; }+li { margin-right: 16px; }，list-style完全正常，且天然形成BFC -
li { display: inline-block; vertical-align: top; }，兼容IE8+，注意HTML换行会留空隙，可用font-size: 0在ul上清除 - 别给
li设width或height，IE7下会触发序号全为“1”的bug
ul没padding-left是真凶，不是list-style-position的问题
通配符重置如* { padding: 0; }会干掉ul默认的左内边距（约40px），而标记就靠这段空间绘制。修复只需：
-
ul, ol { padding-left: 2rem; }（推荐值，兼顾缩放） - 子列表要单独声明：
ul ul, ol ol { padding-left: 1.5rem; }，不能靠继承 - 别用
margin-left替代——它对标记定位无效
实在不能动结构？手动模拟标记
仅限必须保留float的遗留项目，此时原生counter()不可靠，得放弃语义：
- 先关掉原生样式：
li { list-style: none; } - 用伪元素硬写：
li::before { content: "• "; margin-right: 8px; } - 若需有序列表，别依赖
counter()，改用data-index属性或JS控制 - 注意
::before是inline，li高度不一致时可能需要vertical-align: top
真正容易被忽略的是：标记是否可见，表面看是样式问题，根因是BFC缺失——浮动只是诱因，父容器没建立可靠的块格式化上下文，浏览器连该在哪画标记都拿不准。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
