Bootstrap 3 之 Bootstrap 警告

在 Bootstrap 中,警告(Alerts)是用来向用户显示重要信息或警告的组件。警告可以在页面的顶部或底部展示,并且可以包含一个关闭按钮供用户关闭。

使用警告

要创建一个警告,我们可以使用以下 HTML 代码结构:

---- ------------ ---------------
  -------------------- ---------
------

在上面的代码中,我们使用了 alertalert-warning 类来创建一个黄色警告框,并在其中包含了一个加粗的标题和警告消息。

警告类型

Bootstrap 提供了多种不同颜色和样式的警告类型,包括:

  • alert-success:绿色成功警告
  • alert-info:蓝色信息警告
  • alert-warning:黄色警告
  • alert-danger:红色危险警告

我们可以根据需要选择合适的警告类型来展示不同的信息。

关闭警告

警告框中还可以包含一个关闭按钮,让用户可以手动关闭警告框。要在警告框中添加关闭按钮,可以使用以下代码:

---- ------------ ------------ -------------------
  ------- ------------- ------------- -------------------- -------------------
    ----- ---------------------------------
  ---------
  -------------------- --------------
------

在上面的代码中,我们在警告框中添加了一个关闭按钮,并使用了 alert-dismissible 类来实现关闭功能。

总结

警告是 Bootstrap 中一个常用的组件,可以用来向用户显示重要信息或警告。通过选择不同的警告类型和添加关闭按钮,我们可以灵活地展示各种不同类型的警告信息。在设计页面时,可以根据具体的需求来选择合适的警告类型和样式来提高用户体验。


上一篇:Bootstrap 缩略图
下一篇:Bootstrap 进度条