最稳妥的方式是直接用 border CSS 属性；Bootstrap 默认不提供自定义边框样式的独立工具类，border- 工具类仅控制颜色和宽度，不支持 dashed 等线型，需用 border-style 或完整 border 声明。
直接用 border CSS 属性最稳妥
bootstrap 默认不提供“自定义边框样式”的独立工具类（比如 border-dashed-red-2 这种），强行用多个 border- 工具类组合（如 border border-dashed border-danger）虽能工作，但容易被覆盖或语义混乱。真正可控、可复用的方式是写一行内联样式或加一个自定义 class。
- 内联方式适合单次快速调试：
<div style="border: 2px dashed #e63757;">内容</div> - 推荐写 CSS 类（尤其多处复用时）：
.border-custom-dash-pink { border: 2px dashed #e63757; } - 注意：Bootstrap 的
border-工具类（如border-primary）只控制颜色和宽度，不支持dashed/dotted/double等线型 —— 这些必须靠border-style或完整border声明
用 Bootstrap 工具类组合的边界情况
如果你坚持用内置类，得清楚哪些能叠加、哪些会冲突。例如 border（启用边框）+ border-dashed（设置线型）+ border-warning（设颜色）在 Bootstrap 5.3+ 是支持的，但有前提：
-
border-dashed必须在border之后声明，否则可能被重置为solid - 颜色类（如
border-danger）只改border-color，不改border-width；若没显式加border或border-2，默认宽度是1px，可能太细看不清 - 移动端断点类（如
border-md-dashed）需 Bootstrap 5.2+，旧版本不识别
避免被 !important 或重置样式覆盖
常见现象：加了 border-dashed 却还是实线，或者边框突然消失。大概率是以下原因：
- 父容器有
overflow: hidden且子元素边框超出 padding 区域（视觉上被裁掉） - 其他 CSS 规则用了
border: none或border: 0，且权重更高（比如组件库自带样式） - 你用了
border-0类又想加自定义边框 ——border-0就是border: 0 !important，必须删掉它才能生效 - 检查 computed styles：浏览器开发者工具里看最终生效的
border-style和border-width，别只信 class 名字
需要圆角 + 自定义边框？顺序很重要
Bootstrap 的 rounded- 类（如 rounded-2）作用于 border-radius，它和边框本身无关，但视觉上必须一起考虑：
- 圆角不会“切掉”虚线边框，但虚线段在转角处可能断裂或错位 —— 这是浏览器渲染限制，不是代码错
- 如果边框太细（
1px）+ 圆角太大（rounded-5），虚线可能看起来像实线，建议搭配border-2或手动设border-width: 2px - 不要把
rounded-类和自定义边框写成两个 class 就完事；确保它们共存时没有其他规则干扰，比如某些卡片组件自带border-radius: 0
style="border: ..." 或一个三行 CSS 类就解决。纠结工具类组合，往往是因为没意识到 Bootstrap 的边框工具类本质是快捷写法，不是设计系统边界。真要灵活控制，就得回到 CSS 本身 —— 它没那么可怕，也比猜类名快。
