ylbtech-Bootstrap-CL:标签
1.返回顶部
1、

Bootstrap 标签

本章将讲解 Bootstrap 标签。标签可用于计数、提示或页面上其他的标记显示。使用 class .label 来显示标签,如下面的实例所示:

实例

<h1>Example Heading <span class="label label-default">Label</span></h1>
<h2>Example Heading <span class="label label-default">Label</span></h2>
<h3>Example Heading <span class="label label-default">Label</span></h3>
<h4>Example Heading <span class="label label-default">Label</span></h4>

尝试一下 »

结果如下所示:

您可以使用修饰的 class label-default、label-primary、label-success、label-info、label-warning、label-danger 来改变标签的外观,如下面的实例所示:

实例

<span class="label label-default">默认标签</span>
<span class="label label-primary">主要标签</span>
<span class="label label-success">成功标签</span>
<span class="label label-info">信息标签</span>
<span class="label label-warning">警告标签</span>
<span class="label label-danger">危险标签</span>

尝试一下 »

结果如下所示:


标签更多实例

描述 实例
.label label-default 默认的灰色标签 尝试一下
.label label-primary "primary" 类型的蓝色标签 尝试一下
.label label-success "success" 类型的绿色标签 尝试一下
.label label-info "info" 类型的浅蓝色标签 尝试一下
.label label-warning "warning" 类型的黄色标签 尝试一下
.label label-danger "danger" 类型的红色标签 尝试一下
2、
2.返回顶部
 
3.返回顶部
 
4.返回顶部
 
5.返回顶部
1、
2、
 
11.返回顶部
 
作者:ylbtech
出处:http://ylbtech.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

Bootstrap-CL:标签的更多相关文章

  1. bootstrap基本标签总结2

    [布局]bootstrap基本标签总结2   缩略图 <div class="container"> <div class="row"> ...

  2. bootstrap基本标签总结[转]

    文件头: DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title> ...

  3. bootstrap 下 标签页跳转总结

    最近遇到一个问题,是关于bootstrap中的标签页实现上的一些功能实现,现总结一下. 问题描述:点击其他标签页后,如何在点击搜索按钮后自动跳转到第一个标签页.如下图 通过对bootstrap框架里的 ...

  4. [布局] bootstrap基本标签总结

    文件头: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <titl ...

  5. [布局]bootstrap基本标签总结2

    缩略图 <div class="container"> <div class="row"> <div class="co ...

  6. bootstrap 混合标签

    <html lang="zh_cn"> <head> <meta charset="utf-8"> <meta htt ...

  7. bootstrap栅栏系统css中的col-xs-*、col-sm-*、col-md-* 的意义以及 bootstrap一个标签中,同时有 col-xs , col-sm , col-md , col-lg的理解

    摘要: bootstrap栅栏系统css中的col-xs-*.col-sm-*.col-md-* 的意义: .col-xs- 超小屏幕 手机 (<768px) .col-sm- 小屏幕 平板 ( ...

  8. BootStrap tabs标签 使用fade效果首次加载页面不能显示内容

    <div class="tab-pane active fade" id="home"> <div class="alert ale ...

  9. bootstrap -- 一个标签中,同时有 col-xs , col-sm , col-md , col-lg

    .col-xs- 超小屏幕 手机 (<768px) .col-sm- 小屏幕 平板 (≥768px) .col-md- 中等屏幕 桌面显示器 (≥992px) .col-lg- 大屏幕 大桌面显 ...

  10. bootstrap tab标签页

    <ul id="myTab" class="nav nav-tabs"> <li class="active"> & ...

随机推荐

  1. NIO概述及实例(时钟服务器)

    NIO,非阻塞IO,重点是非阻塞而不是异步! NIO的一般实现如下: package com.pt.nio; import java.net.InetSocketAddress; import jav ...

  2. Mongo配置基础

    数据库也是一种服务,数据库的本质也是一个文件,所以说我们把文件存入text和存入数据库的本质是一样的,只是数据库的格式化的删除和添加. 分为四部分, mongo的启动详解 导入导出,运行时备份 Fsy ...

  3. 拖拉记录上下移动--Ajax UI

    所谓的 Ajax 拖拉 UI,就是直接用鼠标进行拖拉排序,这种方式对用户来说操作速度更快. 拖拉的 UI 需要额外的前端套件,这里介绍 jQuery UI 的 Sortable Plugin,并直接使 ...

  4. CSS 列表样式详解

    CSS列表用于前端的列表排列. CSS列表属性作用如下: 设置不同的列表项标记为有序列表 设置不同的列表项标记为无序列表 设置列表项标记为图像 列表 在HTML中,有两种类型的列表: 无序列表 - 列 ...

  5. K-Means算法的收敛性和如何快速收敛超大的KMeans?

    不多说,直接上干货! 面试很容易被问的:K-Means算法的收敛性. 在网上查阅了很多资料,并没有看到很清晰的解释,所以希望可以从K-Means与EM算法的关系,以及EM算法本身的收敛性证明中找到蛛丝 ...

  6. Java线程状态分析

    Java线程的生命周期中,存在几种状态.在Thread类里有一个枚举类型State,定义了线程的几种状态,分别有: NEW: 线程创建之后,但是还没有启动(not yet started).这时候它的 ...

  7. Leetcode 15

    //用类似双指针的方法,确定第一个i的位置后,j和k向左向右移动使nums[j]+nums[k] = -nums[i];注意特判 class Solution { public: vector< ...

  8. [转载]CentOS 6.3安装Subversion服务器

    转载自http://www.cnblogs.com/zhoulf/archive/2013/02/02/2889949.html 安装说明 系统环境:CentOS-6.3 安装方式:yum insta ...

  9. L203 词汇题

    Conditions for the growth of this plant are optimum in early summer.we will live as free people, not ...

  10. ReactNative 问题集合

    在线流畅播放视频 (建议调用原生的视频组件, 或者在成熟的安卓 ios组件封装一层) 如何指定页面横屏 (在这个组件react-native-orientation基础上改写) webSocket不和 ...