bootstrap中的按钮类

一般可以作为按钮的标签有:<a></a>  <button></button>  <input type='button' />上面

如图:

如果要改变按钮的尺寸:

   .btn-large:尺寸最大;

  .btn-small:尺寸中等;

  .btn-mini:尺寸最小

为按钮添加小图标:

  i标签表示添加的小图标: icon-comment

  图标的颜色:默认是黑色,还可以设定白色为 .icon-white

  <button type='submit' class='btn btn-success'><i class='icon-comment icon-white'></i> 立刻评论</button>

  要了解更多的小图标类:http://twitter.github.com/bootstrap/base-css.html#icons

Bootstrap页面布局13 - BS按钮的更多相关文章

  1. Bootstrap页面布局14 - BS按钮群组

    首先看看这个代码: <div class='btn-group'> <button type='button' class='btn'>计算机</button> & ...

  2. Bootstrap页面布局3 - BS布局以及流动布局

    1. <h1 class='page-header'>布局<small> 使用bootstrap网格系统布局网页</small></h1> 得到如图所示 ...

  3. Bootstrap页面布局15 - BS带下拉菜单的按钮

    带下拉菜单的按钮 <div class='btn-toolbar'> <div class='btn-group'> <a href='javascript:;' cla ...

  4. Bootstrap页面布局16 - BS导航菜单和其响应式布局以及导航中的下拉菜单

    代码: <div class='container-fluid'> <h2 class='page-header'>导航</h2> <!-- .navrbar ...

  5. Bootstrap页面布局9 - BS列表

    列表: 无序列表(列表中项目内容没有固定的顺序), 有序列表(通常使用在一组有前后顺序的内容上), 描述列表(定义解释一组词汇) 无序列表: <ul> <li>Ueditor编 ...

  6. Bootstrap页面布局19 - BS提示信息

    提示信息的设计 提示信息的类: .alert:提示信息类 .alert alert-danger: .alert alert-error: .alert alert-success: .alert a ...

  7. Bootstrap页面布局18 - BS导航路径以及分页器

    导航路径:又叫“面包屑”,功能是让用户知道所处的位置. <!--面包屑--> <ul class='breadcrumb'> <li><a href='#'& ...

  8. Bootstrap页面布局17 - BS选项卡

    代码结构: <div class='container-fluid'> <h2 class='page-header'>Bootstrap 选项卡</h2> < ...

  9. Bootstrap页面布局24 - BS旋转木马功能

    代码: <div class='container-fluid'> <h3 class='page-header'>Bootstrap 旋转木马</h3> < ...

随机推荐

  1. Java Hour 10

    有句名言,叫做10000小时成为某一个领域的专家.姑且不辩论这句话是否正确,让我们到达10000小时的时候再回头来看吧. 本文作者Java 现经验约为10 Hour,请各位不吝赐教. Hour 10 ...

  2. 微信jsapi接口测试

    微信jsapi接口测试 <?php require_once 'lib.inc.php'; $wx = new WxApi(); if(!isset($_GET['code'])){ heade ...

  3. 在getView方法产生给用户item的视图以及数据

    在getView方法产生给用户item的视图以及数据

  4. JSON详解(转)

    JSON详解 JSON的全称是”JavaScript Object Notation”,意思是JavaScript对象表示法,它是一种基于文本,独立于语言的轻量级数据交换格式.XML也是一种数据交换格 ...

  5. 【JUnit 报错】java.lang.IncompatibleClassChangeError

    使用Junit 测试spring时候报错: java.lang.IncompatibleClassChangeError: class org.springframework.core.LocalVa ...

  6. BZOJ2062 : 素颜2(face2)

    写个cmp然后sort就好了. cmp的话,需要快速知道两个串的lcp,于是倍增+Hash即可. #include<cstdio> #include<algorithm> ty ...

  7. HDU 4681 String(DP)

    题目链接 枚举A和B中每一段含有C的段,A的前面 后面和B前面后面,求最长公共子序.观察发现,可以预处理最长公共子序. #include <iostream> #include <c ...

  8. COJ980 WZJ的数据结构(负二十)

    试题描述 在Bytemountains有N座山峰,每座山峰有他的高度h_i.有些山峰之间有双向道路相连,共M条路径,每条路径有一个困难值,这个值越大表示越难走,现在有Q组询问,每组询问询问从点v开始只 ...

  9. oracle系列--第五篇 PLSQL连接本地的Oracle数据库

    这篇blog主要是针对新手,我也是个新手:) 我们把oracle成功的安装在了我们的计算机上面,那我们如何才能将PLSQL developer连 接到本地的oracle呢? 首先,我们必须有下面步准备 ...

  10. oracle 存储过程 基础

    差不多一年没写过存储过程,最近要写,发现基本忘了,google一番之后,觉得很有必要把基础的东西写下来备忘. 语句块定义: decalre -- 变量声明 var1 ); -- 仅声明 var2 ) ...