Bootstrap-按钮篇btn
参考网址:http://v3.bootcss.com/(能抄不写)
1、按钮颜色样式:

对应代码:(主要体现在class内容:btn-default,btn-primary...)
<button type="button" class="btn btn-default">(默认样式)Default</button>
<button type="button" class="btn btn-primary">(首选项)Primary</button>
<button type="button" class="btn btn-success">(成功)Success</button>
<button type="button" class="btn btn-info">(一般信息)Info</button>
<button type="button" class="btn btn-warning">(警告)Warning</button>
<button type="button" class="btn btn-danger">(危险)Danger</button>
<button type="button" class="btn btn-link">(链接)Link</button>
<a href="#" class="btn btn-primary" role="button">Primary link</a>
2、按钮大小样式

对应代码:(主要体现在class内容:btn-lg,btn-sm,btn-xs...)
<p>
<button type="button" class="btn btn-primary btn-lg">(大按钮)Large button</button>
<button type="button" class="btn btn-default btn-lg">(大按钮)Large button</button>
</p>
<p>
<button type="button" class="btn btn-primary">(默认尺寸)Default button</button>
<button type="button" class="btn btn-default">(默认尺寸)Default button</button>
</p>
<p>
<button type="button" class="btn btn-primary btn-sm">(小按钮)Small button</button>
<button type="button" class="btn btn-default btn-sm">(小按钮)Small button</button>
</p>
<p>
<button type="button" class="btn btn-primary btn-xs">(超小尺寸)Extra small button</button>
<button type="button" class="btn btn-default btn-xs">(超小尺寸)Extra small button</button>
</p>
3、禁用btn

对应代码:(主要体现在class内容:disabled="disabled" ; disabled)
<button class="btn btn-lg btn-primary" type="button" disabled="disabled">Primary button</button>
<a href="#" class="btn btn-primary btn-lg disabled" role="button">Primary link</a>
Bootstrap-按钮篇btn的更多相关文章
- Bootstrap 按钮
本章将通过实例讲解如何使用 Bootstrap 按钮.任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: ...
- bootstrap按钮组
种类 -a, input , button 块级 btn-block 按钮组 btn-group btn-group-justified btn-group-vertical </div ...
- bootstrap按钮
按钮 基类 -btn 样式 btn-default(默认) btn-link(链接) 大小 btn-*[lg,sm,xs] 状态 active disabled <!DOCTYPE HTML&g ...
- BootStrap 按钮组简单介绍
学会按钮组需要掌握以下几个类. btn btn-group btn-toolbar btn-group-vertical 和 下拉菜单的基本类 dropdown-toggle dropdow ...
- Bootstrap 按钮分组
Bootstrap 按钮分组: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- bootstrap 按钮 文本 浮动 隐藏
bootstrap 按钮 文本 浮动 隐藏 <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- Bootstrap按钮插件
前面的话 按钮插件提供了一组可以控制按钮多种状态的功能,比如按钮的禁用状态.正在加载状态.正常状态等.本文将详细介绍Bootstrap按钮插件 加载状态 通过按钮可以设计状态提示,当单击按钮时,会显示 ...
- Bootstrap -- 按钮样式与使用
Bootstrap -- 按钮样式与使用 1. 可用于<a>, <button>, 或 <input> 元素的按钮样式 按钮样式使用: <!DOCTYPE h ...
- 简单叨叨bootstrap按钮无限层级下拉菜单的实现
0.写在前面的话 最近看书都懈怠了,又正值新项目,虽说并不是忙得不可开交,好吧我老实交待,我就是偷懒了其实,博客也没更.言归正传,对于前端的不熟悉现在确实是个让我头疼的事情,以至于一些功能要在网络上漫 ...
- 第二百四十七节,Bootstrap按钮和折叠插件
Bootstrap按钮和折叠插件 学习要点: 1.按钮 2.折叠 本节课我们主要学习一下 Bootstrap 中的按钮和折叠插件. 一.按钮 可以通过按钮插件创建不同状态的按钮,也就是点击后为选中状态 ...
随机推荐
- Prometheus Operator 架构【转】
本节讨论 Prometheus Operator 的架构.因为 Prometheus Operator 是基于 Prometheus 的,我们需要先了解一下 Prometheus. Prometheu ...
- MapReduce会自动忽略文件夹下的.开头的文件
MapReduce会自动忽略文件夹下的.开头的文件,跳过这些文件的处理.
- pandas包 —— drop()、sort_values()、drop_duplicates()
一.drop() 函数 当你要删除某一行或者某一列时,用drop函数,它不改变原有的df中的数据,而是返回另一个dataframe来存放删除后的数据. 1.命令: df.drop() 删除行:df.d ...
- mysql导入导出无权限
error:The MySQL server is running with the --secure-file-priv option so it cannot execute this state ...
- springmvc线程安全问题
对于使用过SpringMVC和Struts2的人来说,大家都知道SpringMVC是基于方法的拦截,而Struts2是基于类的拦截.struct2为每一个请求都实例化一个action所以不存在线程安全 ...
- UVA - 122 Trees on the level (二叉树的层次遍历)
题意:给定结点值和从根结点到该结点的路径,若根到某个叶结点路径上有的结点输入中未给出或给出超过一次,则not complete,否则层次遍历输出所有结点. 分析:先建树,建树的过程中,沿途结点都申请了 ...
- js 跳转链接
1.跳转链接 在当前窗口打开 window.location.href="http://www.baidu.com" 等价于 <a href="baidu.com& ...
- 微信小程序实现左滑删除效果(原生/uni-app)
实现效果 列表中侧滑删除 删除不同时存在 scrollview上下滑动与侧滑删除不影响 uni-app实现 html部分 <template> <scroll-view :scrol ...
- zoj1002
Suppose that we have a square city with straight streets. A map of a city is a square board with n r ...
- 一个基于chrome扩展的自动答题器
1.写在前面 首先感谢小茗同学的文章-[干货]Chrome插件(扩展)开发全攻略, 基于这篇入门教程和demo,我才能写出这款 基于chrome扩展的自动答题器. git地址: https://git ...