警告提示
Alert
UI 组件也叫：提示条、横幅提示、Banner、Callout
一句话：固定显示在页面或区块内的带色提示横条，用来说明当前状态、风险或需要注意的事项。
详细解释
警告提示是页面里一块带底色的横条，左侧有图标，右侧是一两句说明，有时带「去处理」链接或关闭按钮。它按严重程度分成成功、信息、警告、错误四种，用不同颜色和图标区分。它是页面内容的一部分，不会自动消失，通常放在页面顶部、表单上方或某个区块开头。文档站里常见的「提示」「注意」框（Callout）也属于这一类。
和 轻提示 的区别：轻提示浮在页面上、几秒后消失，用来反馈刚刚的操作；警告提示是静态的，说明一个持续存在的状态，比如「试用期还剩 3 天」「当前网络离线」。和 通知提醒框 的区别：通知从角落弹出，是新到达的消息；警告提示不会弹出，它就长在页面里。
示例
灰度线框示意，只表达结构，不代表具体视觉风格。
怎么跟 AI 说
可以直接贴给 Cursor、Claude Code 等工具，把里面的业务内容换成你自己的。
在表单顶部放一个黄色警告提示条，左侧是感叹号图标，文字写「你的邮箱尚未验证，部分功能无法使用」，右侧带「立即验证」链接和关闭按钮；关闭后本次访问不再显示，提示条和表单同宽，不要做成浮动弹窗。
结构与适用场景
结构描述
一个带底色和边框的横条，由状态图标、标题或说明文字、可选的操作链接和关闭按钮组成。
适用场景
- 需要持续提醒一个尚未解决的状态，比如账号未验证、服务维护中
- 表单提交失败，需要在表单上方汇总说明原因
- 文档或设置页里，需要把一段注意事项和正文区分开
不适用场景
- 只是反馈刚完成的操作结果，比如「复制成功」
- 新到达的消息需要吸引注意，而用户可能正在页面别处操作
- 同一页面要显示很多条提示，堆在一起会让人全部忽略
常见坏用法
- 页面顶部叠了三四个警告提示条，把正文挤到首屏以下
- 所有提示都用红色错误样式，用户分不清轻重
- 把警告提示做成悬浮在内容上方的浮层，遮住了下面的表单
识别特征
- 与内容同宽的浅色底横条，带细边框或左侧色块
- 左侧有对勾、感叹号或叉号等状态图标
- 位置固定在页面流里，不会自动消失
DOM 线索
插件本地识别时匹配的 CSS 选择器（标签、ARIA role、常见组件库 class）。
[role="alert"].ant-alert.el-alert[class*="MuiAlert-root"].arco-alert.t-alert.n-alert[data-slot="alert"].alert