Bootstrap 4 JS 警报
警报 CSS 类
有关警报的教程,请阅读我们的 Bootstrap 警报教程。
类 | 描述 | 例子 |
---|---|---|
.alert |
创建一个警报消息框 | 测试一下 |
.alert-danger |
红色警报。表示危险或潜在的负面行为 | 测试一下 |
.alert-dark |
黑暗警报。深灰色警报框 | 测试一下 |
.alert-dismissible |
表示可关闭的警报框。与 .close 类一起,该类用于关闭警报(添加额外的填充) |
测试一下 |
.alert-heading |
将 color:inherit 添加到指定元素 |
测试一下 |
.alert-info |
浅蓝色警报。表示中性信息更改或操作 | 测试一下 |
.alert-light |
轻警报。浅灰色警报框 | 测试一下 |
.alert-link |
用于警报内的链接以提供匹配的彩色链接 | 测试一下 |
.alert-primary |
蓝色警报。表示重要动作 | 测试一下 |
.alert-secondary |
灰色警报。表示"不太重要"的动作 | 测试一下 |
.alert-success |
绿色警报。表示成功或积极的行动 | 测试一下 |
.alert-warning |
黄色警报。表示应谨慎执行此操作 | 测试一下 |
.close |
为警报消息设置关闭按钮的样式(以指定的字体大小、颜色等向右浮动) | 测试一下 |
通过 data-* 属性关闭警报
将 data-dismiss="alert"
添加到链接或按钮元素以关闭警报消息。
通过 JavaScript 关闭警报
手动关闭:
Alert 选项
None |
Alert 方法
下表列出了所有可用的警报方法。
方法 | 描述 | 试一试 |
---|---|---|
.alert("close") | 关闭警报消息 | 测试一下 |
.alert("dispose") | 破坏元素的警报。 |
Alert 事件
下表列出了所有可用的警报事件。