3.10 Bootstrap 标签

文章目录

  • Bootstrap 标签
    • 标签


Bootstrap 标签

在这里插入图片描述

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

<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” 类型的红色标签

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/4265.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何二次封装一个el-table组件并二次复用

*注:示例使用的是vue3和element进行二次封装的 首先我们来看效果图&#xff08;总共可以分为以下几个模块&#xff09;&#xff1a; 表格数据操作按钮区域表格信息提示区域表格主体内容展示区域表格分页区域 表单搜索没有封装在这里是为了降低代码的耦合性(有兴趣的可以查看我…

python实现小波降噪

文章目录 小波分解小波系数小波降噪阈值确定的一些小知识点python 实现小波去噪小波分解 上图为对信号进行3层小波分解,其中,Approximation 为近似小波系数(信号的低频成分),Detail为细节小波系数(信号的高频成分),分解后得到四个小波系数分别为A3,D3,D2,D1。 小波系数 小…

图片速览 DCN K-means-friendly Spaces: Simultaneous Deep Learning and Clustering

本文使用了一种交替更新网络参数和聚类中心的方法。在网络更新完成之后&#xff0c;对于固定的网络参数和 M&#xff0c;再更新当前样本的分配向量。然后根据新的分配结果如式子3.8更新聚类中心&#xff1a; 注&#xff1a;文中还有问题是否能进行凸优化的部分 CG https…

MySQL日常操作记录

1.查看MySQL版本 select version();2.快速复制表结构&#xff0c;不包含相关主键及约束 create table user_test as select * from user where 12;3.uuid select uuid(),uuid_short();4.替换uuid()里的’-‘为’’ select replace(uuid(),-,);5.md5摘要 select md5(uuid()…

剑指29.顺时针打印矩阵 31 栈的压入,弹出序列 03 数组中的重复数字 53缺失的数字 04二维数组中的查找

class Solution { public:vector<int> spiralOrder(vector<vector<int>>& matrix) { if (matrix.size() 0 || matrix[0].size() 0&#xff09; return {};//必须要写到最前面&#xff0c;因为right和bottom-1就是负数了vector<int> result;int l…

ELK-日志服务【kafka-配置使用】

kafka-01 10.0.0.21 kafka-02 10.0.0.22 kafka-03 10.0.0.23 【1】安装zk集群、配置 [rootes-01 ~]# yum -y install java maven [rootes-01 ~]# tar xf apache-zookeeper-3.5.9-bin.tar.gz -C /opt/[rootes-01 ~]# cd /opt/apache-zookeeper-3.5.9-bin/conf/ [rootes-…

爬虫相关知识与面试题目

常见的反爬虫和应对方法 参考:https://www.cnblogs.com/bsdr/p/5151891.html 0x01 常见的反爬虫 这几天在爬一个网站&#xff0c;网站做了很多反爬虫工作&#xff0c;爬起来有些艰难&#xff0c;花了一些时间才绕过反爬虫。在这里把我写爬虫以来遇到的各种反爬虫策略和应对的…

剑指offer33.二叉搜索树的后序遍历序列

我一开始的想法是&#xff1a;后序遍历是左右根&#xff0c;那么第一个数小于第二个数&#xff0c;第二个数大于第三个数&#xff0c;然后从第三个数开始又循环&#xff0c;显然错了&#xff0c;因为我这种是理想情况&#xff0c;是一个满二叉树。正确的解法是: class Solutio…

正则表达式

一、正则表达式基本介绍 1. 介绍 一个正则表达式&#xff0c;就是用某种模式去匹配字符串的一个公式。很多人因为它们看上去比较古怪而且复杂所以不敢去使用&#xff0c;不过,经过练习后,就觉得这些复杂的表达式写起来还是相当简单的&#xff0c;而且&#xff0c;一旦你弄懂它…

Shuffle简单理解

map的结果本身是无序的&#xff0c;但是map输出的结果有序 mapper和reduce是不同的机器&#xff0c;进行了网络传输&#xff0c;所以存在数据拷贝 第二次排序&#xff0c;是将每个reduce对应的task进行排序&#xff0c;然后再进入reduce maptask运行结束&#xff0c;每个mask块…

能耗管理平台保障用电的安全

安科瑞虞佳豪 壹捌柒陆壹伍玖玖零玖叁 6月12日&#xff0c;江苏盐城射阳县某民房起火&#xff0c;消防救援人员到场后&#xff0c;立即对火势进行扑救&#xff0c;经过20多分钟的处置&#xff0c;现场明火全部被扑灭&#xff0c;据了解&#xff0c;起火原因是电线老化短路引发…

短视频seo抖音矩阵号系统源码开发搭建分享

我们自主研发的短视频矩阵系统源码&#xff0c;技术研发的独立核心算法的视频内容管理和展示功能。无需额外的流量接口费用和复杂的配置&#xff0c;轻松地创建和管理短视频内容&#xff0c;短视频矩阵源码是指将抖音平台上的视频资源进行筛选、排序等操作&#xff0c;进而提升…

Redis简介(1)

⭐ 作者简介&#xff1a;码上言 ⭐ 代表教程&#xff1a;Spring Boot vue-element 开发个人博客项目实战教程 ⭐专栏内容&#xff1a;个人博客系统 ⭐我的文档网站&#xff1a;http://xyhwh-nav.cn/ 文章目录 Redis简介1、NoSQL1.1、什么是NoSQL&#xff1f;1.2、NoSQL 特点…

【java爬虫】使用selenium获取某宝联盟淘口令

上一篇文章我们已经介绍过使用selenium获取优惠券基本信息的方法 (15条消息) 【java爬虫】使用selenium爬取优惠券_haohulala的博客-CSDN博客 本文将在上一篇文章的基础上更进一步&#xff0c;获取每个优惠券的淘口令&#xff0c;毕竟我们只有复制淘口令才能在APP里面获取优惠…

C++day4 (拷贝构造函数、拷贝赋值函数、匿名对象、友元函数、常成员函数、常对象、运算符重载)

#include <iostream> #include <cstring> using namespace std;class mystring { private:char *str; //记录C风格字符串int size; //记录字符串的实际长度public://无参构造mystring():size(10){strnew char[size];//构造出一个长度为10的字符串strcpy(str,&…

汽车的空气悬架的功能以及发展趋势

空气悬架能实现什么功能以及发展趋势 了解空气悬架之前,首先得快速了解什么是悬架。 教科书说法是: 悬架系统是汽车的车架与车桥或车轮之间的一切传力连接装置的总称。悬架系统基本构成有弹性元件(各类弹簧,缓冲作用);减震元件(减震器,减震作用);导向机构(控制臂等…

《网络是怎样连接的》(一)

本文主要取材于 《网络是怎样连接的》 第一章。 简述&#xff1a;在浏览器输入一个网址&#xff0c;浏览器会解析出域名&#xff0c;但是直接使用域名无法找到Web服务器。需要使用DNS解析器将域名解析为IP地址&#xff0c;然后客户端可以创建套接字&#xff0c;延伸出管道根据…

浅谈设计模式之单例模式

0 单例模式简介 单例模式属于创建型模式&#xff0c;它提供了一种创建对象的最佳方式。单例模式指的是单一的一个类&#xff0c;该类负责创建自己的对象&#xff0c;并且保证该对象唯一。该类提供了一种访问其唯一对象的方法&#xff0c;外部需要调用该类的对象可以通过方法获…

python发送邮件zmail库

第三方库“zmail”和“yagmail”可实现邮件发送。在实际使用对比zmail比yagmail更简洁。使用zmail&#xff0c;无需登录OA邮箱&#xff0c;便可完成邮件的发送及附件的自动加载。 import zmaildef send_zmail(sender, sender_password, addressee, host, port465, inspect_smtp…

【EasyExcel】在SpringBoot+VUE项目中引入EasyExcel实现对数据的导出(封装工具类)

在SpringBootVUE项目中引入EasyExcel实现导入导出 一、引入EasyExcel 通过maven引入&#xff0c;坐标如下&#xff1a; <dependency><groupId>com.alibaba</groupId><artifactId>easyexcel-core</artifactId><version>3.3.2</version…