.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. linux 记录所有用户bash操作日志

    记录所有用户登录系统的任何操作日志,以便有据可查. 1.编辑 /etc/profile文件.   1 # vim /etc/profil 2. 在其后添加如下内容   1 2 3 4 5 6 7 8 ...

  2. PHP之魔术引号

    什么是魔术引号 Warning 本特性已自 PHP5.3.0起废弃并将自PHP5.4.0起移除. 当打开,所有的'(单引号),"(双引号),  (反斜线)和NULL 字符都会被自动加上一个反 ...

  3. Oracle使用par文件进行全库导入导出

    expdp \"/ as sysdba\" PARFILE=/oracle/expdp/AINEWAWARD_20181005.par directory=dumpdir dump ...

  4. LeetCode 706 Design HashMap 解题报告

    题目要求 Design a HashMap without using any built-in hash table libraries. To be specific, your design s ...

  5. 机器学习:K-近邻算法

    K-近邻算法 优点:精度高.对异常值不敏感.无数据输入假定.缺点:计算复杂度高.空间复杂度高.使用数据范围:数值型和标称型. k-近邻算法的一般流程 搜集数据:可以使用任何方法.准备数据:距离计算所需 ...

  6. jquery图片懒加载效果

    1.要引入jquery 2.要引入underscore.js <!DOCTYPE html> <html lang="en"> <head> & ...

  7. for in 循环

    for  in循环可以循环遍历数组  关键也可以循环遍历对象!而一般的for循环只能循环遍历数组, 当循环遍历对象时key值代表键值对的键,obj[key]则是对应键的值: 当循环遍历数组时,数组不是 ...

  8. 27-4-DMA2D图形加速器

    在实际使用 LTDC 控制器控制液晶屏时,使 LTDC 正常工作后,往配置好的显存地址写入要显示的像素数据, LTDC 就会把这些数据从显存搬运到液晶面板进行显示,而显示数据的容量非常大,所以我们希望 ...

  9. python json 模块

    什么是json? json是返回的是字符串格式,把python数据类型列表.字典转换成json字符串格式, 这种格式java php 其他语言都可以认识的字符串,可以跨语言交流. json,用于字符串 ...

  10. Spark中的partition和block的关系

    hdfs中的block是分布式存储的最小单元,类似于盛放文件的盒子,一个文件可能要占多个盒子,但一个盒子里的内容只可能来自同一份文件.假设block设置为128M,你的文件是250M,那么这份文件占3 ...