Bootstrap的alert组件用于快速创建语义化提示框，需正确引入CSS/JS资源，使用alert+颜色类定义样式，推荐添加带data-bs-dismiss的关闭按钮，并支持alert-link等辅助类优化交互与可访问性。
Bootstrap 的 alert 组件是快速创建醒目、语义化提示框的便捷方式，结合 HTML 使用非常简单，关键在于正确引入 Bootstrap 资源、使用标准类名，并注意可访问性与关闭功能。
引入 Bootstrap 资源
确保项目中已加载 Bootstrap 的 CSS 和 JS（含 Popper，用于某些交互）：
- 推荐使用 CDN：在
中引入 Bootstrap CSS，在底部引入 JS（含 jQuery 若用旧版 v4；v5+ 不再依赖 jQuery） - v5 示例（无 jQuery）：
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
基础警告提示框写法
使用 <div> 标签，添加 <code>alert 基础类 + 语义化颜色类（如 alert-warning），内容直接写入：
-
alert-primary/alert-secondary/alert-success/alert-danger/alert-warning/alert-info/alert-light/alert-dark - 示例（黄色警告）：
请检查您的输入格式是否正确。
添加关闭按钮（可选但推荐）
增强用户体验，需三要素：关闭按钮、data-bs-dismiss="alert" 属性、JS 支持（已含在 bootstrap.bundle.min.js 中）：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记（深入）”；
- 按钮必须有
btn-close类和data-bs-dismiss="alert" - 建议添加
aria-label="Close"提升可访问性 - 示例：
您的会话即将过期，请及时保存。
支持链接与额外样式
可在 alert 内嵌入链接，或组合其他工具类优化布局：
- 链接加
alert-link类，自动适配当前 alert 颜色 - 常用辅助类：
mb-0（取消下边距）、text-center（居中文字）、rounded-0（直角） - 示例：
