教程 > bootstrap 3 教程 > 阅读:20

bootstrap 警告(alerts)——迹忆客-ag捕鱼王app官网

本章将讲解警告(alerts)以及 bootstrap 所提供的用于警告的 class。警告(alerts)向用户提供了一种定义消息样式的方式。它们为典型的用户操作提供了上下文信息反馈。

您可以为警告框添加一个可选的关闭按钮。为了创建一个内联的可取消的警告框,请使用 警告(alerts) jquery 插件。

您可以通过创建一个

,并向其添加一个 .alert class 和四个上下文 class(即 .alert-success、.alert-info、.alert-warning、.alert-danger)之一,来添加一个基本的警告框。下面的实例演示了这点:

实例

成功!很好地完成了提交。
信息!请注意这个信息。
警告!请不要提交。
错误!请进行一些更改。

结果如下所示:

bootstrap3 警告


可取消的警告(dismissal alerts)

创建一个可取消的警告(dismissal alert)步骤如下:

  • 通过创建一个
    ,并向其添加一个 .alert class 和四个上下文 class(即 .alert-success、.alert-info、.alert-warning、.alert-danger)之一,来添加一个基本的警告框。
  • 同时向上面的
    class 添加可选的 .alert-dismissable。
  • 添加一个关闭按钮。

下面的实例演示了这点:

实例

成功!很好地完成了提交。
信息!请注意这个信息。
警告!请不要提交。
错误!请进行一些更改。

请确保使用带有 data-dismiss="alert" data 属性的

结果如下所示:

bootstrap3 可取消的警告


警告(alerts)中的链接

在警告(alerts)中创建链接的步骤如下:

  • 通过创建一个
    ,并向其添加一个 .alert class 和四个上下文 class(即 .alert-success、.alert-info、.alert-warning、.alert-danger)之一,来添加一个基本的警告框。
  • 使用 .alert-link 实体类来快速提供带有匹配颜色的链接。

结果如下所示

bootstrap3 警告中的链接

查看笔记

扫码一下
查看教程更方便
网站地图