float: none 仅取消当前元素浮动，不修复父容器塌陷或影响兄弟元素布局；需同步处理BFC触发、尺寸重置及清除残留影响。
float: none 不是用来“清除浮动”的，而是告诉浏览器：“这个元素别浮了，按块级默认行为排”。它只对当前元素生效，不修复父容器塌陷，也不影响兄弟元素是否环绕。
响应式断点中主动取消浮动
在 @media 里写 float: none，本质是配合屏幕变窄时放弃横向抢占空间，让元素回归垂直堆叠。这不是“修复 bug”，而是有意识地切换布局模式。
- 必须同步设置
width: 100%（不能只靠float: none）——否则元素可能还维持着桌面端的width: 33.33%，导致小屏下单列却只占三分之一 - 如果原浮动元素用了
margin-right: 20px分隔，float: none后这个 margin 依然存在，可能造成顶部/底部意外空白 - IE8 及更早版本中，某些嵌套下
float: none不立即重绘，可加zoom: 1触发 hasLayout
为什么写了 float:none 还像在浮动？
大概率不是 float: none 失效，而是其他机制在起作用：
- 父容器用了
position: absolute或fixed，子元素即使float: none也受定位上下文约束 - 元素是
display: inline-block，且 HTML 中有换行或空格，视觉上“并排”，误判为浮动残留 - 父容器已启用
display: flex或grid，此时float属性被规范忽略，float: none自然无意义
float:none 和 clearfix 的关系
float: none 管自己，.clearfix 管父容器。两者职责不同，不能互相替代。
立即学习“前端免费学习笔记（深入）”；
-
.clearfix必须加在**浮动元素的直接父容器**上，加在更外层或元素自身都无效 - 用了响应式浮动类（如
float-lg-start），对应清除也得用响应式类，比如clearfix-lg；写成无前缀的.clearfix会在所有断点强制清除，可能在小屏产生多余空白 - 只给子元素加
float-none，但父容器没清浮，背景/边框照样不显示——因为塌陷还在
真正要小心的，是把 float: none 当成万能开关。它只声明本元素不浮，不负责整个布局链是否自洽。响应式切换的关键，从来不在“怎么关”，而在“关完之后尺寸、清除、盒模型是否全对齐”。
