.btn

---------------------------------

button的背景色:

.btn-primary

.btn-success

.btn-secondary

.btn-danger

.btn-info

.btn-light

.btn-dark

.btn-link

--------------------------

button的边框颜色:

.btn-outline-primary

.btn-outline-secondary

.btn-outline-success

--------------------------------

大小:

.btn-lg

.btn-sm

-------------------------------

状态:

.active

.disabled

disabled作为类只适用于<a>标签,不适用于<button>标签,<button>标签中disabled作为一种属性使用,例如:

<button type="button" class="btn btn-lg btn-primary" disabled>Primary button</button>

<a href="#" class="btn btn-secondary btn-lg disabled" role="button" aria-disabled="true">Link</a>

-----------------------------------

可使用的元素:

<a> <input> <button>

-----------------------------------

混合使用:

.button可与checkbox、radio等混合使用,会产生特殊的效果,如:

实例代码:

<div class="btn-group btn-group-toggle" data-toggle="buttons">

  <label class="btn btn-secondary active">
<input type="radio" name="options" id="option1" autocomplete="off" checked> Active
</label>
<label class="btn btn-secondary">
<input type="radio" name="options" id="option2" autocomplete="off"> Radio
</label>
<label class="btn btn-secondary">
<input type="radio" name="options" id="option3" autocomplete="off"> Radio
</label>
</div>
<div class="btn-group-toggle" data-toggle="buttons">
<label class="btn btn-secondary active">
<input type="checkbox" checked autocomplete="off"> Checked
</label>
</div>
方法:
$().button('toggle') 点击button按钮,会进行状态切换
$().button('dispose') 摧毁button按钮

组件 -- Button的更多相关文章

  1. ListView中的组件Button的OnClick事件触发时机

    Android开发时,ListView中的组件Button的OnClick事件必须在ListView之外的组件事件触发后才能触发? 此处ListView无OnItemClick事件,而且ListVie ...

  2. 微信小程序组件button

    表单组件button:官方文档 Demo Code: var types=['default', 'primary', 'warn']; var pageObject = { data: { defa ...

  3. UI 组件 | Button

    最近在与其他自学 Cocos Creator 的小伙伴们交流过程中,发现许多小伙伴对基础组件的应用并不是特别了解,自己在编写游戏的过程中也经常对某个属性或者方法的用法所困扰,而网上也没有比较清晰的用法 ...

  4. 微信小程序_(表单组件)button组件的使用

    微信小程序表单组件button官方文档 传送门 Learn 一.button组件的使用 一.button组件的使用 size:按钮的大小[默认值default] type:按钮的样式类型[默认值def ...

  5. Android经常使用UI组件 - Button

    button(Button)是Android其中一个经常使用的UI组件.非常小可是在开发中最经常使用到.一般通过与监听器结合使用.从而触发一些特定事件. Button继承了TextView.它的功能就 ...

  6. 组件--button详解

    一.wxss尺寸单位rpx rpx(responsive pixel): 可以根据屏幕宽度进行自适应.规定屏幕宽为750rpx. 严格按照XML语法. 二.icon 图标组件 <!--index ...

  7. android基本组件 Button

    android中提供了普通按钮Buttton和图片按钮ImageButton两种按钮组件,ImageButton按钮中主要有一个android:src属性,用于设置按钮的背景图片.可以在Button的 ...

  8. 安卓开发:UI组件-Button和EditText

    2.3Button Button继承自TextView,除了通过属性设置按钮样式,还可以通过绑定drawable文件的方式来实现不同样式. 2.3.1按钮样式 新建Activity:ButtonAct ...

  9. android基础组件---->Button的使用

    按钮由文本或图标(或文本和一个图标)组成,当用户触摸到它时,会发生一些动作.今天我们开始Button的学习.少年的爱情永远不够用,一杯酒足以了却一件心事. Button的简要说明 根据你是否想要一个带 ...

随机推荐

  1. Spark项目之电商用户行为分析大数据平台之(九)表的设计

    一.概述 数据设计,往往包含两个环节: 第一个:就是我们的上游数据,就是数据调研环节看到的项目基于的基础数据,是否要针对其开发一些Hive ETL,对数据进行进一步的处理和转换,从而让我们能够更加方便 ...

  2. python-celery定时提交任务

    pip install celery 使用消息中间件:RabbitMQ/Redis app=Celery('任务名',backend='xxx',broker='xxx') 基本使用 import c ...

  3. browerify初步了解

    之前在写Signature Request Warnings & eth_sign学习的时候在里的signing examples时了解到browserify工具,可以通过这个例子学习如何使用 ...

  4. Inter exchange Client Address Protocol (ICAP)- 互换客户端地址协议

    https://github.com/ethereum/wiki/wiki/Inter-exchange-Client-Address-Protocol-(ICAP) Transferring fun ...

  5. RMAN删除备份

    删除备份--DELETE命令 用于删除RMAN备份记录及相应的物理文件.当使用RMAN执行备份操作时,会在RMAN资料库(RMAN Repository)中生成RMAN备份记录,默认情况下RMAN备份 ...

  6. css心跳动画

    1.图片无限放大缩小,类似心跳 css如下 @keyframes scaleDraw { /*定义关键帧.scaleDrew关键帧名称*/ 0%{ transform: scale(1); /*开始为 ...

  7. 【转】为什么volatile不能保证原子性而Atomic可以?

    直接上好文链接!!! 为什么volatile不能保证原子性而Atomic可以?

  8. DQN(Deep Reiforcement Learning) 发展历程(一)

    目录 马尔可夫理论 马尔可夫性质 马尔可夫过程(MP) 马尔可夫奖励过程(MRP) 值函数(value function) MRP求解 马尔可夫决策过程(MDP) 效用函数 优化的值函数 贝尔曼等式 ...

  9. C语言各种数据类型取值范围

    速查表: char -128 ~ +127 1Byte -2^7 ~ 2^7-1 unsigned char 0 ~ 255 1Byte 0 ~ 2^8-1 short -32767 ~ + 3276 ...

  10. 20155334 《网络攻防》 Exp7 网络欺诈防范

    20155334 <网络攻防> Exp7 网络欺诈防范 一.基础问题回答 通常在什么场景下容易受到DNS spoof攻击 同一局域网下,以及各种公共网络. 在日常生活工作中如何防范以上两攻 ...