<p>Bootstrap 5 中 border-2 对按钮无效是因为 .btn 类默认设 border: none；需搭配 border（定义样式）和 border-{color}（定义颜色）才能生效，推荐使用 btn-outline-* 系列或显式写全 border border-2 border-primary。</p>
Bootstrap 5 中 border-2 对按钮无效？
直接给 <button class="btn btn-primary border-2"> 加 border-2 不起作用，是因为 Bootstrap 的 .btn 类默认用 border: none（或 border: 0）清除了边框。border-2 只是设置 border-width: 2px，但前提是边框本身没被干掉。
如何让 border-2 在按钮上生效
必须显式恢复边框样式（颜色、样式），否则宽度设了也看不见：
-
border-2必须搭配border（即border-style: solid）和border-{color}（如border-primary）一起用 - 推荐写法：
class="btn btn-primary border border-2 border-white"（白边）或class="btn btn-outline-primary border-2"（用 outline 类自带边框） - 如果想保留原色边框但加粗，别只信
border-2，补全：border border-2 border-primary - 注意：Bootstrap 5 的
border-{color}工具类默认只设border-color，不设border-style，所以border（等价于border: solid）不能省
btn-outline-* 是更稳妥的选择
如果你只是想让按钮有可见的、可调粗细的边框，优先用 btn-outline-* 系列 —— 它们本就是靠边框定义样式的，border-2 能直接叠加生效：
-
<button class="btn btn-outline-primary border-2">确定</button>→ 边框立刻变 2px -
<button class="btn btn-outline-secondary border-4">取消</button>→ 支持border-1到border-5 - 对比
btn-primary：后者背景主导，边框是装饰；前者边框才是主体，加粗逻辑更自然
自定义边框粗细时要注意的兼容点
Bootstrap 5 的 border-{size} 工具类基于 $border-widths Sass map，默认只有 1–5，且单位固定为 px。这意味着：
- 无法用
border-2实现1.5px或0.0625rem这类非整数像素值 - 如果项目已覆盖
$border-widths，要确认2这个 key 对应的值确实是2px - 在高 DPI 屏幕下，
2px边框可能看起来比预期更细（因物理像素密度高），此时建议用rem单位自定义 CSS，而非依赖工具类
border 和 border-{color} 的组合必要性 —— 少一个，border-2 就只是个沉默的声明。 
