Bootstrap 5 中用 input-group + input-group-text 套图标最稳，语义清晰、响应式可靠、无障碍友好；图标须置于 input-group-text 内，按 DOM 顺序控制左右位置，SVG 需设 em 尺寸，禁用态需统一处理并补充 aria 属性。
Bootstrap 5 中用 input-group 套图标最稳
直接上结论：bootstrap 5 官方推荐且唯一干净支持图标的表单输入方式，是用 input-group + input-group-text，而不是给 input 加背景图或绝对定位。前者语义清晰、响应式可靠、无障碍友好；后者容易错位、缩放失真、屏幕阅读器读不到图标含义。
常见错误现象：input 上用 background-image 加图标，结果在 iOS Safari 里光标偏移、在缩放 125% 时图标被裁、用户用键盘聚焦时看不到图标上下文。
-
input-group必须包裹整个结构（input+ 左/右图标容器），不能只包图标 - 图标必须放在
input-group-text内，不能直接塞i或svg—— 否则丢失 padding 对齐和垂直居中逻辑 - 如果用 Font Awesome，
fa类要加在span或i上，且该元素必须是input-group-text的直接子元素
<div class="input-group"> <span class="input-group-text"><i class="fas fa-user"></i></span> <input type="text" class="form-control" placeholder="用户名"> </div>
左侧图标和右侧图标的 DOM 顺序不能反
Bootstrap 的 input-group 依赖 CSS Flex 排序，默认按 HTML 顺序从左到右渲染。想让图标在右边，必须把 input-group-text 放在 input 后面；反之放前面。DOM 顺序一错，图标就跑到对面去了，而且没法用 CSS order 可靠修正 —— 因为 input-group 内部有固定 flex-direction: row 和预设 order 值。
- 左侧图标：
input-group-text在input前 - 右侧图标：
input-group-text在input后 - 同时左右都有？可以，但必须严格按「text → input → text」顺序，否则中间的
input会被 flex 拉伸变形
<div class="input-group"> <input type="password" class="form-control"> <span class="input-group-text"><i class="fas fa-eye"></i></span> </div>
图标尺寸和行高要跟 .form-control 对齐
默认 input-group-text 高度和 .form-control 一致，但如果你自定义了 font-size、用了 SVG 图标没设 height/width，或者用了不同版本的图标字体，就容易出现图标上下偏移、左右撑开间距、甚至换行。
- SVG 图标务必加
height="1em"和width="1em"，避免继承父级宽高异常 - Font Awesome 图标加
fa-fw类（固定宽度），防止字母图标（如fa-user）和符号图标（如fa-lock）宽度不一致导致对齐抖动 - 不要给
input-group-text单独设padding—— 它的内边距由 Bootstrap 的$input-group-text-padding-y变量控制，改它要重编译 CSS
带图标的输入框在禁用状态下的表现
当 input 设 disabled，input-group-text 不会自动变灰或失焦，得手动加 disabled 到整个 input-group 容器，或单独给 input-group-text 加 bg-secondary text-muted 类模拟禁用态。否则会出现“输入框灰了，但图标还亮着”的割裂感。
- 正确做法：给
div.input-group加disabled属性（Bootstrap 5.3+ 支持）或加opacity: .6类 - 如果只禁用
input，记得同步给input-group-text加pointer-events-none，否则用户还能点图标（比如眼图标切换密码可见性） - 图标如果是可交互的（如清空按钮），禁用时必须用
aria-disabled="true"和tabindex="-1"，否则键盘用户会卡住
aria-hidden="true"（纯装饰），或带 aria-label（功能型），这点容易被忽略，但影响无障碍体验。 
