菜单
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

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" 以关闭警告消息。

示例

<a href="#" class="close" data-dismiss="alert">&times;</a>
自己动手试一试 »

通过 JavaScript 关闭警告框

手动关闭

示例

$('.close').alert("close");
自己动手试一试 »

警告框选项

警告框方法

下表列出了所有可用的警告框方法。

方法 描述 试一试
.alert("close") 关闭警告消息 试一试
.alert("dispose") 销毁元素的警告框。

警告框事件

下表列出了所有可用的警告框事件。

事件 描述 试一试
close.bs.alert 在警告消息即将关闭时触发 试一试
closed.bs.alert 在警告消息关闭后触发(将等待 CSS 过渡完成) 试一试

×

联系销售

如果您想将 W3Schools 服务用于教育机构、团队或企业,请发送电子邮件给我们
sales@w3schools.com

报告错误

如果您想报告错误,或想提出建议,请发送电子邮件给我们
help@w3schools.com

W3Schools 经过优化,旨在方便学习和培训。示例可能经过简化,以提高阅读和学习体验。教程、参考资料和示例会不断审查,以避免错误,但我们无法保证所有内容的完全正确性。使用 W3Schools 即表示您已阅读并接受我们的使用条款Cookie 和隐私政策

版权所有 1999-2024 Refsnes Data。保留所有权利。W3Schools 由 W3.CSS 提供支持