本章将讲解bootstrap标签，标签可用于计数，提示和页面上其它的标记显示。使用class.laber来显示标签，如下面的实例所示

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：标签(label)</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:100px;">
<h1>This Is Heading:<span class="label label-default">Label</span></h1>
<h2>This Is Heading:<span class="label label-default">Label</span> </h2>
<h3>This Is Heading:<span class="label label-default">Label</span></h3>
</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 标签的更多相关文章

  1. Bootstrap<基础二十> 标签

    Bootstrap 标签.标签可用于计数.提示或页面上其他的标记显示.使用 class .label 来显示标签,如下面的实例所示: <!DOCTYPE html> <html> ...

  2. Bootstrap <基础二十九>面板（Panels）

    Bootstrap 面板(Panels).面板组件用于把 DOM 组件插入到一个盒子中.创建一个基本的面板,只需要向 <div> 元素添加 class .panel 和 class .pa ...

  3. Bootstrap <基础二十八>列表组

    列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-group. 向 <li> 添加 cl ...

  4. Bootstrap <基础二十六>进度条

    Bootstrap 进度条.在本教程中,你将看到如何使用 Bootstrap 创建加载.重定向或动作状态的进度条. Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果.Internet ...

  5. Bootstrap <基础二十五>警告（Alerts）

    警告(Alerts)以及 Bootstrap 所提供的用于警告的 class.警告(Alerts)向用户提供了一种定义消息样式的方式.它们为典型的用户操作提供了上下文信息反馈. 您可以为警告框添加一个 ...

  6. Bootstrap<基础二十四> 缩略图

    Bootstrap 缩略图.大多数站点都需要在网格中布局图像.视频.文本等.Bootstrap 通过缩略图为此提供了一种简便的方式.使用 Bootstrap 创建缩略图的步骤如下: 在图像周围添加带有 ...

  7. Bootstrap <基础二十二>超大屏幕（Jumbotron）

    Bootstrap 支持的另一个特性,超大屏幕(Jumbotron).顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin).使用超大屏幕(Jumbotron)的步骤如下: ...

  8. Bootstrap <基础三十二>模态框（Modal）插件

    模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. 如果您想要单独引用该插件的功能,那么您需要引用  ...

  9. Bootstrap <基础三十>Well

    Well 是一种会引起内容凹陷显示或插图效果的容器 <div>.为了创建 Well,只需要简单地把内容放在带有 class .well 的 <div> 中即可.下面的实例演示了 ...

  10. Bootstrap<基础二十七> 多媒体对象（Media Object）

    Bootstrap 中的多媒体对象(Media Object).这些抽象的对象样式用于创建各种类型的组件(比如:博客评论),我们可以在组件中使用图文混排,图像可以左对齐或者右对齐.媒体对象可以用更少的 ...

随机推荐

  1. 51nod1107(逆序对数&归并排序)

    题目链接:http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1107 题意:中文题诶- 思路:通过题意可以发现对于两点p1(x ...

  2. 洛谷P2513 [HAOI2009]逆序对数列

    P2513 [HAOI2009]逆序对数列 题目描述 对于一个数列{ai},如果有i<j且ai>aj,那么我们称ai与aj为一对逆序对数.若对于任意一个由1~n自然数组成的数列,可以很容易 ...

  3. Picture poj1177

    Picture Time Limit: 2000MS   Memory Limit: 10000K Total Submissions: 12265   Accepted: 6484 Descript ...

  4. SpringBoot2.0 基础案例(11)：配置AOP切面编程，解决日志记录业务

    本文源码 GitHub地址:知了一笑 https://github.com/cicadasmile/spring-boot-base 一.AOP切面编程 1.什么是AOP编程 在软件业,AOP为Asp ...

  5. php高并发之opcache

    今天工作的时候接触到客户的一台服务器,业务逻辑比较简单 .估算pv在120w左右吧,用的是阿里云2c4g的服务器.一大早就开始卡顿了,登陆服务器后查看负载到了八九十. 之后就想办法调整一下吧.突然想起 ...

  6. ssrf漏洞分析

    ssrf漏洞分析 关于ssrf 首先简单的说一下我理解的ssrf,大概就是服务器会响应用户的url请求,但是没有做好过滤和限制,导致可以攻击内网. ssrf常见漏洞代码 首先有三个常见的容易造成ssr ...

  7. Codeforces 384E-线段树+dfs序

    如果这题只传到儿子不继续向下就是裸的dfs序+线段树,继续往下传的还改变正负号,我们可以根据它的层数来确定正负号 #include<bits/stdc++.h> #define inf 0 ...

  8. 《java学习二》jvm性能优化-----认识jvm

    Java内存结构 Java堆(Java Heap) java堆是java虚拟机所管理的内存中最大的一块,是被所有线程共享的一块内存区域. 在虚拟机启动时创建.此内存区域的唯一目的就是存放对象实例,这一 ...

  9. nio aio netty区别

    传统io就是bio     同步阻塞         但可以采用伪同步 nio  jdk1.7以前     同步非阻塞io     1.7以后     同步异步非阻塞                  ...

  10. 给Eclipse设置android的SDK位置时，出现这个：This Android SDK requires Andr...ate ADT to the latest

    这样的问题很好解决,一个升级ADT到指定版本或以上,另一个简单的办法是调低SDK版本 找到android-sdk-windows\tools\lib下的plugin.prop文件修改其中的版本号,改为 ...