Alert边框圆角需直接覆盖.alert的border-radius属性，阴影须手动设置box-shadow，二者需协同控制以避免渲染异常。
Alert边框圆角不能靠rounded类生效
bootstrap的.alert组件默认圆角来自自身css规则（如border-radius: .375rem），不是由rounded工具类控制的。加rounded-0或rounded-pill完全无效——因为这些类只作用于“无预设圆角”的元素，而.alert已显式声明了border-radius，权重更高。
必须直接覆盖.alert的border-radius属性：
-
.alert { border-radius: 0 !important; }（彻底去圆角） -
.alert { border-radius: 12px !important; }（加大圆角，注意单位用px或rem） - 若只想改某类警告（如仅
.alert-danger），写.alert-danger { border-radius: 6px !important; }
⚠️ 坑：如果用了CSS-in-JS或scoped style，!important可能被隔离失效，此时需提高选择器权重，例如body .alert或.alert:not(.no-radius)。
Alert阴影不能用shadow工具类叠加
.alert默认无box-shadow，但部分自定义主题或第三方扩展可能加了。如果你看到阴影，大概率是父容器、卡片包装或全局box-shadow规则透出的——.alert本身不带shadow类支持。
要加/改阴影，只能手动写box-shadow：
- 加轻微浮层：
.alert { box-shadow: 0 2px 4px rgba(0,0,0,.08); } - 加强立体感：
.alert { box-shadow: 0 4px 12px rgba(0,0,0,.12); } - 去阴影（如果意外出现）：
.alert { box-shadow: none !important; }
注意：不要依赖shadow-sm/shadow-lg等工具类——它们对.alert不生效，因Bootstrap未将这些类绑定到.alert的选择器链中。
圆角+阴影组合时的渲染顺序陷阱
圆角和阴影必须同时控制，否则会出现“阴影溢出圆角”或“圆角被遮盖”：
- 先确保
border-radius已设好，再加box-shadow——否则阴影会按原始直角区域投射 - 避免
overflow: hidden乱用：.alert内部没有子元素撑出溢出，加overflow: hidden一般没意义，反而可能截断伪元素或动画 - 高DPI屏下，
box-shadow的模糊值（如4px）可能显得过重，建议搭配媒体查询微调：@media (min-resolution: 1.25dppx) { .alert { box-shadow: 0 2px 3px rgba(0,0,0,.06); } }
真正干净的视觉效果，靠的是这两行CSS的协同，而不是拼凑一堆工具类。
