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(需要 ...
随机推荐
- P4553 80人环游世界
题目地址:P4553 80人环游世界 上下界网络流 无源汇上下界可行流 给定 \(n\) 个点, \(m\) 条边的网络,求一个可行解,使得边 \((u,v)\) 的流量介于 \([B(u,v),C( ...
- 2017-2018-2 20165325 实验三《Java面向对象程序设计》实验报告
一.敏捷开发与XP实践-1 1.检查点要求 实验三 敏捷开发与XP实践 http://www.cnblogs.com/rocedu/p/4795776.html, Eclipse的内容替换成IDEA ...
- SpringSecurity实现用户名密码登录(Token)
传统的应用是将Session放在应用服务器上,而将生成的JSESSIONID放在用户浏览器的Cookie中,而这种模式在前后端分离中就会出现以下问题 1,开发繁琐. 2,安全性和客户体验差 3,有些前 ...
- 修改JDK版本配置
我使用的maven是3.0.5版本的,在创建项目的时候,默认使用的jdk为1.5版本 在项目的pom.xml中添加如下配置可修改使用的jdk版本. <properties> <!-- ...
- Zookeeper-Watcher机制与异步调用原理
转载于:http://shift-alt-ctrl.iteye.com/blog/1847320 Watcher机制:目的是为ZK客户端操作提供一种类似于异步获得数据的操作. 1)在创建Zookeep ...
- 开启gtid导入报错
导入报错 [root@redis02 data]# mysql -u root -p < ht.sqlEnter password: ERROR 1840 (HY000) at line 24: ...
- 自然语言处理之LCS最长公共子子序列
#!一个序列S任意删除若干个字符得到的新序列T,则T叫做S的子序列 注意,这个和最长公共字串不一样,最长公共子串要求连续. 1.算法公式: def lcs(a,b): lena = len(a) le ...
- liunx contos 7.4 安装redis集群
前前后后安装了几次redis集群,基本上每次安装都会采坑,耗时伤神. 安装redis依赖gcc环境,安装前先检查liunx上面有没有安装GCC 命令:gcc -v 上传redis-4.0.1.tar. ...
- Android 组件化方案探索与思考
Android 组件化方案探索与思考 组件化项目,通过gradle脚本,实现module在编译期隔离,运行期按需加载,实现组件间解耦,高效单独调试. 本项目github地址 https://githu ...
- swift 学习- 16 -- 构造过程 02
// 类的继承 和 构造过程 // 类里面的所有的存储型属性 -- 包括所有继承自父类的属性 -- 都必须在构造过程中设置初始值 // Swift 为类类型提供了 两种构造器来确保实例中所有的存储属 ...