BootStrap笔记-信息提示框的使用
生活随笔
收集整理的這篇文章主要介紹了
BootStrap笔记-信息提示框的使用
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
程序運行截圖如下：
源碼如下；
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>CN_TEST1</title><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><!-- bootstrap css核心文件--><link rel="stylesheet" href="bootstrap-4.4.1-dist/css/bootstrap.min.css"> <!-- bootstrap使用到了jquery，需要提前引用--><script src="js/jquery-3.5.1.min.js"></script> <!-- 彈窗、提示、下拉菜單--><script src="bootstrap-4.4.1-dist/js/bootstrap.bundle.js"></script> <!-- bootstrap核心文件--><script src="bootstrap-4.4.1-dist/js/bootstrap.min.js"></script></head> <body><div class="container-fluid"><div class="alert alert-success"><strong>成功</strong></div><div class="alert alert-danger alert-dismissible fade show"><button type="button" class="close" data-dismiss="alert" style="outline: none">×</button><strong>危險操作</strong></div></div> </body> </html>解釋：
①其中alter就是信息提示框，后面可以接.alert-sucess、alert-info、alert-waring、alert-danger、alert-secondary、alert-light、alert-dark；
②×打包是關閉符號，如：
?后面有各種各樣的符號；
③.fade和.show在關閉提示框時有淡出和淡入的效果。
總結
以上是生活随笔為你收集整理的BootStrap笔记-信息提示框的使用的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： ajax结合接口 分页插件
- 下一篇： fastadmin在html中查询数据,