bootstrap的模拟单选按钮
<div class="btn-group" data-toggle="buttons" id="radio">
<label class="mt10 mr5 w140 btn bdr-0 bdc-C4C4C4 c-7D809C fw600">
<input type="radio" name="style_radio">Sedan
</label>
<label class="mt10 mr5 w140 btn bdr-0 bdc-C4C4C4 c-7D809C fw600">
<input type="radio" name="style_radio">Coupe
</label>
<label class="mt10 mr5 w140 btn bdr-0 bdc-C4C4C4 c-7D809C fw600">
<input type="radio" name="style_radio">Truck
</label>
<label class="mt10 mr5 w140 btn bdr-0 bdc-C4C4C4 c-7D809C fw600">
<input type="radio" name="style_radio">Van
</label>
<label class="mt10 mr5 w140 btn bdr-0 bdc-C4C4C4 c-7D809C fw600">
<input type="radio" name="style_radio">SUV
</label>
<label class="mt10 mr5 w140 btn bdr-0 bdc-C4C4C4 c-7D809C fw600">
<input type="radio" name="style_radio">Luxury
</label>
</div>
.btn.active, .btn:active{
background-color: #4BE4CC;
color: #FFF;
border: 1px solid #FFF;
} .mt10{
margin-top: 10px;
}
.mr5{
margin-right: 5px;
}
.w140{
width: 140px;
}
.bdr-0{
border-radius: 0;
}
.bdc-C4C4C4{
background-color: #C4C4C4;
}
.c-7D809C{
color: #7D809C
}
.fw600{
font-weight: 600;
}
bootstrap的模拟单选按钮的更多相关文章
- bootstrap框架下 单选按钮组的选中以及取值问题
1.业务功能:四个按钮只能选中一个,且默认选择水准4 先看代码. <div class="btn-group" data-toggle="buttons" ...
- Bootstrap按钮插件
前面的话 按钮插件提供了一组可以控制按钮多种状态的功能,比如按钮的禁用状态.正在加载状态.正常状态等.本文将详细介绍Bootstrap按钮插件 加载状态 通过按钮可以设计状态提示,当单击按钮时,会显示 ...
- bootstrap 支持的JavaScript插件
一次性导入: Bootstrap提供了一个单一的文件,这个文件包含了Bootstrap的所有JavaScript插件,即bootstrap.js(压缩版本:bootstrap.min.js). 具体使 ...
- html单选按钮用jQuery中prop()方法设置
模拟单选按钮时用jQuery,prop方法来设置. 赋默认选中值:$("#" + id).find("input:radio[value='" + state ...
- boostrap插件
第一章:模态弹出框 一.导入JavaScript插件 Bootstrap的JavaScript插件可以单独导入到页面中,也可以一次性导入到页面中.因为在Bootstrap中的JavaScript插件都 ...
- bootstrap3-javascript插件- 慕课笔记
bootstrap支持的js插件 说明:文中内容系本人在某网站学习笔记,本着本站禁止推广的原则,在此就不著明学习站点的名称及地址.其实开博客的目的也就是为了方便记录学习,因为平时本地的记录太多丢三落四 ...
- css3 选择器(三)
接css3选择器(一) 接css3 选择器(二) 这篇和前两篇内容相关性不大,主要是涉及到一些css3的状态选择器,所以标题从一开始. 一.[:enabled]选择器 一看这个属性就知道是专为表单元素 ...
- kibana去掉丑陋的basic验证框,用自定义验证代替。
最近在改写kibana,碰到了验证登录的问题.问题是这样子的,nginx设置了basic认证,然后客户端访问kibana的时候总是会弹出登录框,输入用户名和密码,现在要改写这个登陆框,用bootstr ...
- bootstrap4中文版(纯手工翻译)
1初步开始 1.1依赖 这个仓储包含一系列基于bootstrap标识和css样式的原生angular2指令.所以是不需要依赖jq和bootstrap.js的.只需要以下依赖即可: Angular(需要 ...
随机推荐
- 20165231 2017-2018-2 《Java程序设计》第5周学习总结
教材学习内容总结 第七章 内部类 在一个类中声明另一个类,这样的类称作内部类,而包含内部类的类成为内部类的外嵌类. 内部类的类体中不可以声明类变量和类方法.外嵌类的类体中可以用内部类声明对象,作为外嵌 ...
- java虚拟机的堆内存配置
官网文档地址:https://docs.oracle.com/javase/8/docs/technotes/tools/unix/java.html 接录如下: -XX:MaxHeapSize=si ...
- Git常用命令总结(超实用)【转】
转自:https://www.linuxprobe.com/git-common-commands.html 本文由LinuxProbe.Com团队成员逄增宝整理发布,原文来自:Linux就这么学. ...
- DevExpress VCL 的 cxDBTreeList 的使用方法
DevExpress VCL 的 cxDBTreeList 的使用方法:(假设控件名为: WBSTree) 1.控件WBSTree 通过绑定 DataSet 获取数据记录(Nodes),通过 Col ...
- 利用Linux系统生成随机密码的10种方法【转】
Linux操作系统的一大优点是对于同样一件事情,你可以使用高达数百种方法来实现它.例如,你可以通过数十种方法来生成随机密码.本文将介绍生成随机密码的十种方法. 1. 使用SHA算法来加密日期,并输出结 ...
- 二层环路保护,SEP多实例的配置
作者:邓聪聪 智能以太保护SEP(Smart Ethernet Protection)是一种专用于以太网链路层的环网协议.SEP是一种以太环路保护机制,它通过有选择性地阻塞网络环路冗余链路,来达到消除 ...
- python3+selenium框架设计10-发送邮件
使用python3的email模块和smtplib模块可以实现发送邮件的动能.email模块用来生成email,smtplib模块用来发送邮件,接下来看如何在生成测试报告之后,并将报告放在邮件附件中并 ...
- Ubuntu16下apache2安装ssl阿里云证书
1.用下面的命令确保ssl模块已经加载进apache: a2enmod ssl 如果你看到了“Module ssl already enabled”这样的信息就说明你成功了,如果你看到了“Enabli ...
- 请求头缺少 'Access-Control-Allow-Origin'
报错: 火狐上运行,出现报错信息.已拦截跨源请求:同源策略禁止读取位于 https://xxxxxxx 的远程资源.(原因:CORS 头缺少 'Access-Control-Allow-Origin' ...
- Android ADT 离线下载
网上很多的Android在IDE eclipse的开发环境教程,ADT的就安装肯定也在里面啦 ADT的安装都是一个在线安装地址: https://dl-ssl.google.com/android/e ...