bootstrap 警告(Alerts)
本章将讲解警告(Alerts)以及bootstrap所提供的用于警告的class类。警告(Alerts)向用户提供了一种定义消息样式的方式。它们为典型的用户操作提供了上下文信息反馈。
您可以为警告框添加一个可选的关闭按钮。为了创建一个内联的可取消的警告框，请使用 警告（Alerts） jQuery 插件。
您可以通过创建一个 <div>，并向其添加一个 .alert class 和四个上下文 class（即 .alert-success、.alert-info、.alert-warning、.alert-danger）之一，来添加一个基本的警告框。下面的实例演示了这点：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div style="padding:20px">
<p class="alert alert-success">成功，很好地完成了提交。</p>
<p class="alert alert-info">信息，这个消息很重要。</p>
<p class="alert alert-warning">警告，幸好没有进行提交。</p>
<p class="alert alert-danger">错误，请进一步修改。</p>
</div>
<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>
bootstrap 警告(Alerts)的更多相关文章
- Bootstrap <基础二十五>警告（Alerts）
警告(Alerts)以及 Bootstrap 所提供的用于警告的 class.警告(Alerts)向用户提供了一种定义消息样式的方式.它们为典型的用户操作提供了上下文信息反馈. 您可以为警告框添加一个 ...
- Bootstrap <基础二十九>面板（Panels）
Bootstrap 面板(Panels).面板组件用于把 DOM 组件插入到一个盒子中.创建一个基本的面板,只需要向 <div> 元素添加 class .panel 和 class .pa ...
- Bootstrap <基础二十八>列表组
列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-group. 向 <li> 添加 cl ...
- Bootstrap <基础二十六>进度条
Bootstrap 进度条.在本教程中,你将看到如何使用 Bootstrap 创建加载.重定向或动作状态的进度条. Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果.Internet ...
- Bootstrap<基础二十四> 缩略图
Bootstrap 缩略图.大多数站点都需要在网格中布局图像.视频.文本等.Bootstrap 通过缩略图为此提供了一种简便的方式.使用 Bootstrap 创建缩略图的步骤如下: 在图像周围添加带有 ...
- Bootstrap <基础二十二>超大屏幕（Jumbotron）
Bootstrap 支持的另一个特性,超大屏幕(Jumbotron).顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin).使用超大屏幕(Jumbotron)的步骤如下: ...
- Bootstrap<基础二十> 标签
Bootstrap 标签.标签可用于计数.提示或页面上其他的标记显示.使用 class .label 来显示标签,如下面的实例所示: <!DOCTYPE html> <html> ...
- 夯实Java基础(二十五)——JDBC使用详解
1.JDBC介绍 JDBC的全称是Java Data Base Connectivity(Java数据库连接).是一种用于执行SQL语句的Java API,可以为多种关系数据库提供统一访问(例如MyS ...
- Bootstrap <基础三十二>模态框（Modal）插件
模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. 如果您想要单独引用该插件的功能,那么您需要引用 ...
- Bootstrap <基础三十>Well
Well 是一种会引起内容凹陷显示或插图效果的容器 <div>.为了创建 Well,只需要简单地把内容放在带有 class .well 的 <div> 中即可.下面的实例演示了 ...
随机推荐
- PowerDesigner设计表时显示注释列Comment，Columns中没有Comment的解决办法
我使用的PowerDesigner版本为16.5,如下图: 在所要编辑的表上双击,打开Table Properties窗口,并将上面的选项卡切换到Columns,如下图: 我们点击Customize ...
- php 判断手机号运营商
/* 移动:134.135.136.137.138.139.150.151.157(TD).158.159.187.188 联通:130.131.132.152.155.156.185.186 电信: ...
- 分层确定性钱包开发的代码实现（HD钱包服务）
HD Wallets的全称是Hierachical Deterministic Wallets, 对应中文是 分层确定性钱包. 这种钱包能够使用一组助记词来管理所有的账户的所有币种,在比特币的BIP3 ...
- 洛谷P3646 [APIO2015]巴厘岛的雕塑（数位dp）
传送门 话说莫非所有位运算都可以用贪心解决么……太珂怕啦…… 一直把或运算看成异或算我傻逼…… 考虑从高位到低位贪心,如果能使答案第$i$位为0那么肯定比不为$0$更优 然后考虑第$i$位是否能为$0 ...
- IT兄弟连 Java语法教程 Java开发环境 配置Java环境变量
在安装完JDK后,我们需要配置系统的环境变量,否则在控制台中使用JDK为我们提供的工具时将出现如图12所示的错误信息. 图12 未配置环境变量时执行java命令提示的错误信息 当出现这样的提示信息时 ...
- glassfish 自定义 jaas realm
https://www.oschina.net/translate/custom-jaas-realm-for-glassfish-3
- 本机和虚拟机互联 设置静态IP vmware 虚拟网络 桥接 NAT 仅主机 自定义
- 黑马Mybatis day3 多表查询 1.xml配置方式 2.注解方式
package com.itheima.mozq; import com.itheima.domain.Order; import com.itheima.mapper.OrderMapper; im ...
- jave （java的ffmpeg框架）简单使用
引入文件( jave-native-win64 windows 64位系统jave-native-linux64 linux 64位系统按自己服务器系统来替换 ) <dependency> ...
- mycat学习日记：全局sequence
mycat分库分表的情况下,原生mysql的自增长主键无法满足主键全局唯一这个要求.看了MYCAT社区从零开始的一篇博客,加上自己的实践,大概总结一下. 目前mycat对于全局sequence主要提供 ...