Bootstrap按钮必须组合使用基础类.btn和语义化修饰类（如.btn-primary）才生效；漏写.btn会导致样式失效，颜色类仅是修饰符，依赖.btn提供的基础样式。
Bootstrap按钮的样式不是靠“选一个类就行”，而是由基础类 .btn 和语义化修饰类组合决定的；漏掉 .btn，颜色或尺寸类会失效。
必须带 .btn 才生效的颜色类
所有颜色类（如 .btn-primary）都只是修饰符，不能单独使用。它们依赖 .btn 提供的 padding、border-radius、font-weight 等基础样式。常见错误是只写 .btn-primary，结果按钮看起来像普通文字。
-
.btn-primary：深蓝，用于主要操作（如“提交”“保存”） -
.btn-success：绿色，表示成功/确认动作（如“支付完成”） -
.btn-danger：红色，危险操作（如“删除账户”），慎用 -
.btn-warning：黄色，需用户确认的中间态（如“清空缓存”） -
.btn-outline-*类（如.btn-outline-secondary）也必须和.btn共存，否则边框和文字色不会应用
.btn-link 是个特例，但行为不等于 <a></a>
.btn-link 会移除背景和边框，视觉上像链接，但它仍是按钮元素——会触发 click 事件、支持 disabled、能放在表单中提交。别把它当 <a href></a> 用，否则可能破坏表单逻辑或键盘导航（比如按回车不触发）。
- 适合场景：表单内“忘记密码？”“切换登录方式”这类辅助操作
- 禁用时要用
disabled属性 +.disabled类双保险，仅加类无法阻止点击 - 若真要跳转，用
<a></a>+role="button"，而不是硬套.btn-link
尺寸和布局类可叠加，但有兼容性注意点
.btn-lg 和 .btn-sm 改变的是 padding 和 font-size，不影响颜色逻辑；.btn-block 在 Bootstrap 5 中已废弃，改用 class="d-block w-100" 或 Flex 布局控制宽度。
- Bootstrap 4 仍支持
.btn-block，但 Bootstrap 5+ 移除了该类，直接用工具类替代 -
.btn-lg+.btn-outline-*组合时，边框粗细不变，但文字变大，视觉上可能显得“空”——需检查设计稿是否接受这种留白 - 小屏下
.btn-sm可能导致文字过小（尤其在 iOS Safari），建议搭配min-width或媒体查询兜底
最常被忽略的是：按钮语义必须匹配实际行为。比如用 .btn-danger 标记“导出数据”就容易引发误点，而“删除”却用了 .btn-secondary，会让用户失去风险感知。样式不是装饰，是交互契约的一部分。
