Bootstrap 5 中 float-left/float-right 已被移除，改用 float-start/float-end 等响应式工具类；需手动清除浮动，推荐优先使用 d-flex 替代。
float 类在 Bootstrap 5 中已被移除，改用 utilities
Bootstrap 5 不再提供 float-left、float-right 这类旧类名。如果你在升级项目或新建项目中写这些类，它们不会生效——浏览器会忽略，CSS 里根本没定义。
替代方案是使用响应式浮动工具类，语法统一为 float-{breakpoint}-{direction}，比如：
<div class="float-start">左浮动</div> <div class="float-md-end">中屏及以上右浮动</div> <div class="float-lg-none">大屏取消浮动</div>
-
float-start/float-end是基础类，等价于传统float: left和float: right，且自动适配 RTL（从右向左）布局 - 支持断点前缀：
sm、md、lg、xl、xxl，例如float-sm-start表示“小屏起生效” -
float-none用于清除浮动，常配合响应式组合使用（如先右浮，大屏时取消）
为什么不用 float 了？常见误用场景
很多人仍习惯用 float 做布局（比如左右两栏），但 Bootstrap 官方明确不推荐——因为浮动本身有天然缺陷：父容器高度塌陷、需要额外清除、难以对齐、响应式切换生硬。
真正该用的现代方案是：
- 栅格系统：
col-6+col-6或col-md-4+col-md-8，语义清晰、自动换行、无需清浮 - Flex 工具类：
d-flex、justify-content-between、align-items-center，适合对齐、分布、垂直居中 - 如果只是图文环绕（如图片左浮、文字绕排），
float-start仍可用，但仅限此场景
清除浮动必须手动加吗？
是的，Bootstrap 不自动帮你清浮。用了 float-start 后，后续元素仍会受浮动影响（文字上爬、块级元素重叠）。你得显式处理：
- 最简单：在浮动元素后加一个带
clearfix类的空 div：<div class="clearfix"></div> - 更推荐：给浮动元素的父容器加
overflow-hidden（注意可能裁剪子元素的position: absolute内容） - 或者直接用 Flex 替代——父容器加
d-flex，子项自然不脱离文档流，根本不用清
Bootstrap 4 升级到 5 的浮动类对照表
老项目迁移时容易漏掉这些变化，直接替换会失效：
-
float-left→float-start -
float-right→float-end -
float-none保留，但新增了响应式版本如float-xl-none -
clearfix类仍在，功能不变，但不再绑定:after伪元素清除（改为用display: table实现）
最易被忽略的是 RTL 支持——float-start 在阿拉伯语页面会自动变成右浮，而旧版 float-left 是硬编码方向，这点在国际化项目里要特别留意。
