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("close") | 关闭警告消息 | 试一试 |
.alert("dispose") | 销毁元素的警告框。 |
警告框事件
下表列出了所有可用的警告框事件。