Bootstrap 标签

Bootstrap3 教程 · 2019-03-01 15:13:57

本章将讲解 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" 类型的红色标签

点击查看所有 Bootstrap3 教程 文章: https://www.codercto.com/courses/l/25.html

查看所有标签

尽在双11:阿里巴巴技术演进与超越

尽在双11:阿里巴巴技术演进与超越

阿里巴巴集团双11技术团队 / 电子工业出版社 / 2017-4 / 79

“双 11”,诞生于杭州,成长于阿里,风行于互联网,成就于新经济,贡献于全世界。 从 2009 年淘宝商城起,双 11 已历经八年。每年的双 11 既是当年的结束,又是走向未来的起点。技术的突破创新,商业模式的更替交互,推动着双 11 迈步向前。 《尽在双11——阿里巴巴技术演进与超越》是迄今唯一由阿里巴巴集团官方出品、全面阐述双 11 八年以来在技术和商业上演进和创新历程的书籍。内容......一起来看看 《尽在双11:阿里巴巴技术演进与超越》 这本书的介绍吧!

在线进制转换器
在线进制转换器

各进制数互转换器

HEX CMYK 转换工具
HEX CMYK 转换工具

HEX CMYK 互转工具