.btn          基础class
.btn-default  白底黑字的按钮
.btn-warning  红色按钮
.btn-success  绿色按钮
.btn-info     浅蓝色按钮
.btn-primary  深蓝色按钮
.btn-lg       大号按钮
.btn-sm       小号按钮
.btn-xs       超小号按钮
.btn-block    块级按钮

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="utf-8">

     <meta http-equiv="X-UA-Compatible" content="IE=edge">

     <meta name="viewport" content="width=device-width, initial-scale=1">

     <title>Bootstrap 101 Template</title>

     <!-- Bootstrap -->

     <link href="css/bootstrap.css" rel="stylesheet">

     <!--[if lt IE 9]>

     <script src="js/html5shiv.min.js"></script>

     <script src="js/respond.min.js"></script>

     <![endif]-->

 </head>

 <body>

 <div class="container"></div>

 <h1>全局Css样式---按钮</h1>

 <h3>三种形式的按钮</h3>

 <button class="btn btn-default">button按钮</button>

 <input type="button" class="btn btn-default" value="input按钮">

 <a href="#" class="btn btn-default">LINK按钮</a>

 <h3>三种形式的按钮</h3>

 <button class="btn ">button按钮</button>

 <input type="button" class="btn " value="input按钮">

 <a href="#" class="btn ">LINK按钮</a>

 <h3>按钮的常用颜色总共有五中常用颜色</h3>

 <a href="#" class="btn btn-danger">红色按钮-危险色</a>

 <a href="#" class="btn btn-warning">黄色按钮-警告色</a>

 <a href="#" class="btn btn-success">绿色按钮-成功色</a>

 <a href="#" class="btn btn-info">浅蓝色-提示色</a>

 <a href="#" class="btn btn-primary">深蓝色按钮-基础色</a>

 <h3>按钮的四种大小</h3>

 <a href="#" class="btn btn-success btn-lg" >大号按钮</a>

 <a href="#" class="btn btn-success" >默认号按钮</a>

 <a href="#" class="btn btn-success btn-sm" >小号按钮</a>

 <a href="#" class="btn btn-success btn-xs" >超小号按钮</a>

 <h3>块级按钮</h3>

 <a href="#" class="btn btn-primary btn-block" >深蓝色-块级按钮</a>

 <a href="#" class="btn btn-info btn-block" >浅蓝色-块级按钮</a>

 <a href="#" class="btn btn-danger btn-block" >红色-块级按钮</a>

 <a href="#" class="btn btn-warning btn-block" >黄色-块级按钮</a>

 <a href="#" class="btn btn-success btn-block" >绿色-块级按钮</a>

Bootstrap-按钮相关的class的更多相关文章

  1. 简单叨叨bootstrap按钮无限层级下拉菜单的实现

    0.写在前面的话 最近看书都懈怠了,又正值新项目,虽说并不是忙得不可开交,好吧我老实交待,我就是偷懒了其实,博客也没更.言归正传,对于前端的不熟悉现在确实是个让我头疼的事情,以至于一些功能要在网络上漫 ...

  2. Bootstrap 按钮

    本章将通过实例讲解如何使用 Bootstrap 按钮.任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: ...

  3. BootStrap 按钮组简单介绍

    学会按钮组需要掌握以下几个类. btn   btn-group btn-toolbar  btn-group-vertical   和 下拉菜单的基本类 dropdown-toggle dropdow ...

  4. Bootstrap 按钮分组

    Bootstrap 按钮分组: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  5. bootstrap 按钮 文本 浮动 隐藏

    bootstrap 按钮 文本 浮动 隐藏 <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  6. Bootstrap按钮插件

    前面的话 按钮插件提供了一组可以控制按钮多种状态的功能,比如按钮的禁用状态.正在加载状态.正常状态等.本文将详细介绍Bootstrap按钮插件 加载状态 通过按钮可以设计状态提示,当单击按钮时,会显示 ...

  7. Bootstrap -- 按钮样式与使用

    Bootstrap -- 按钮样式与使用 1. 可用于<a>, <button>, 或 <input> 元素的按钮样式 按钮样式使用: <!DOCTYPE h ...

  8. 使用bootstrap的相关配置

    <html> <head> <title>java微辅导</title> <meta charset="UTF-8"/> ...

  9. 第二百四十七节，Bootstrap按钮和折叠插件

    Bootstrap按钮和折叠插件 学习要点: 1.按钮 2.折叠 本节课我们主要学习一下 Bootstrap 中的按钮和折叠插件. 一．按钮 可以通过按钮插件创建不同状态的按钮,也就是点击后为选中状态 ...

  10. Bootstrap 按钮，图片，辅助类

    Bootstrap 按钮 任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: 以下样式可用于<a&g ...

随机推荐

  1. Android 屏蔽Power键 Home键

    Android 屏蔽Power键 Home键 标签: androidpower键Home键PhoneWindowManagerframework 2014-04-18 17:22 1557人阅读 评论 ...

  2. linux添加新硬盘

    1.添加新磁盘 2.fdisk -l查看磁盘被识别的名称 3.如果输入fdisk -l命令没有找到新的磁盘,按下面步骤操作 1)进入到cd /sys/class/scsi_host/ 2)echo & ...

  3. Chap3:文件系统中跳转[The Linux Command Line]

    1 introduce the following commands pwd - Print name of current working directory cd-Change directory ...

  4. SQLAlchemy_ORM

    ORM 与 SQLAlchemy 简介: ORM 叫对象关系映射,ORM 将对象转换成SQL,然后使用数据API执行SQL并获取执行结果 SQLAlchemy 是Python 社区最知名的 ORM 工 ...

  5. Fiddler怎么可以抓取https的请求包

    对于https的协议是带有安全的功能,所有有一些的https的协议是无法抓到的,所以需要通过设置filler中来对,来使用filler的方式的来抓取到https的请求包,那么如何使用filler中抓取 ...

  6. Celery 出现Process 'Worker-5' pid:5608 exited with 'exitcode 1' 问题

    起初我以为是进程PID文件问题,从新删除问题并未解决. 现已解决办法公布如下: pip install --upgrade billiard 原因:依赖的billiard库版本有点低,更新即可

  7. Docker For Mac没有docker0网桥

    在使用Docker时,要注意平台之间实现的差异性,如Docker For Mac的实现和标准Docker规范有区别,Docker For Mac的Docker Daemon是运行于虚拟机(xhyve) ...

  8. C语言课堂题集

    1.输入一个整数,然后将其数字位置颠倒. int c,d=0,e; scanf("%d",&c); while (c!=0) { e=c%10; d=d*10+e; c/= ...

  9. mysql命令行各个参数解释

    mysql命令行各个参数解释 http://blog.51yip.com/mysql/1056.html Usage: mysql [OPTIONS] [database]   //命令方式 -?, ...

  10. dxCameraControl控件(拍照)

    拍照演示 主要属性设置 Active:True DeviceIndex:设备号,默认为0 其他方法 procedure Capture; //捕获 procedure Pause; //暂停 proc ...