bootstrap 多选款样式:bootstrap-switch
有时候,为了美化checkbox后者radio的时候,让用户体验起来更好,jquery里有icheck。
bootstrap里有bootstrap-switch,就简单介绍下bootstrap-switch。
官网地址:http://www.bootcss.com/p/bootstrap-switch/
GitHub:https://github.com/Bttstrp/bootstrap-switch
js引入:
<script src="/static/js/jquery-2.1.1.min.js"></script>
<script src="/static/js/bootstrap-switch.min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
css引入:
<link href="/static/css/bootstrap-switch.css" rel="stylesheet">
<link href="/static/css/bootstrap.min.css" rel="stylesheet">
js:可以自定义button大小和颜色!
$("[name='sw_checkbox']").bootstrapSwitch(
{
size:"small"
}
);
html:
<label ><input type="checkbox" name="sw_checkbox">    <i class="fa fa-search" aria-hidden="true"></i> xxxx:</label>
效果:

bootstrap 多选款样式:bootstrap-switch的更多相关文章
- 一款基于Bootstrap的js分页插件bootstrap-paginator使用实例
Bootstrap Paginator是一款基于Bootstrap的js分页插件,功能很丰富.它提供了一系列的参数用来支持用户的定制,提供了公共的方法可随时获得插件状态的改变,以及事件来监听用户的动作 ...
- Bootstrap 3的box-sizing样式导致UEditor控件的图片无法正常缩放
UEditor组件是百度提供的一套开源的web在线所见即所得富文本编辑器,具有轻量,可定制,注重用户体验等特点,基于MIT协议,功能很强大.最近在使用的过程中发现其中上传的图片(或者插入已有的表情包图 ...
- Bootstrap表单布局样式
1.并排和下拉选项 <form class="form-horizontal" role="form"> <fieldset> < ...
- bootstrap学习总结-css样式设计(一)
由于项目需要,所以打算好好学习下bootstrap框架,之前了解一点,框架总体不难,但涉及到的东西还是很多,想要熟练掌握它,还是要多练练. 一:bootstrap是什么? bs是什么? 即前端页面搭 ...
- 10款免费Bootstrap后台模板演示及下载
自从有了类似Bootstrap这样强大的前端框架之后,无论我们是做静态页面,还是做网站主题,着实方便很多.即便有很多类似的其他国产.海外的前端框架比较,Bootstrap用户量以及功能文档还是比较大的 ...
- Bootstrap列表与代码样式(附源码)--Bootstrap
给大家分享下Bootstrap框架中列表与代码样式相关的知识 1.列表 (1)无序列表 <ul> <li>CN217编程</li> </ul> 注意:u ...
- [置顶]
bootstrap自定义样式-bootstrap侧边导航栏的实现
前言 bootstrap自带的响应式导航栏是向下滑动的,有时满足不了个性化的需求,需要做一个类似于android drawerLayout 侧滑的菜单,这就是我要实现的bootstrap自定义侧滑菜单 ...
- 【推荐】免费,19 款仿 Bootstrap 后台管理主题下载
声明: 1. 本篇文章提到的仿 Bootstrap 风格的主题,是基于 jQuery 的 ASP.NET MVC 控件库的主题. 2. FineUIMvc(基础版)完全免费,可以用于商业项目. 目录 ...
- 19 款仿 Bootstrap 后台管理主题免费下载
声明: 1. 本篇文章提到的仿 Bootstrap 风格的主题,是基于 jQuery 的 ASP.NET MVC 控件库的主题. 2. FineUIMvc(基础版)完全免费,可以用于商业项目. 目录 ...
随机推荐
- QT5.4.2静态编译(包含QtWebKit),在VS2013上创建项目,并成功运行
Qt项目发布的exe程序,默认是以动态链接形式的,这样发布后的程序会附带好多Qt自己的dll库,这样文件数量不仅多,而且移植到其他电脑上的时候,还可能会遇到,提示缺其他库等各种运行不起 ...
- PHP IN_ARRAY 函数 使用需要注意的地方
今天 看PPChttp://bbs.phpchina.com/thread-171993-1-7.html 这个问题. 其实关键还是因为 php是弱类型语言,php进行比较的时候 最好还是使用stri ...
- JS基础(四)之jQuery
31.jQuery(http://jquery.com/)是一个快速.简洁的JavaScript框架. 它封装了JavaScript常用的功能代码,提供一种便捷的JavaScript设计模式,优化HT ...
- Java实验案例(接口)
实验任务 任务一:设计实现发声接口 任务二:动物乐园 实验内容 任务一:设计实现发声接口 任务目的: 理解并掌握如何定义接口 掌握接口的实现方式 任务描述: 设计和实现一个Soundable接口,该接 ...
- Intel超低功耗CPU的一些信息
2015年底: Intel Braswell是专门针对超低功耗移动和桌面平台的一个家族,现有赛扬N3000/N3050/N3150.奔腾N3700四款型号,其中N300的热设计功耗只有区区4W,其他三 ...
- Transformation functionality for the String class
String类的转换功能: package com.itheima_05; /* * String类的转换功能: * char[] toCharArray():把字符串转换为字符数组 * String ...
- CSS3 选择器用法小结
表单选择器: /*:enabled 可用的 :disabled 被禁用的 :focus 获取了焦点的 多用在表单元素上*/ input:enabled {...} input:disabled {.. ...
- jquery刷新页面的实现代码(局部及全页面刷新)
局部刷新: 这个方法就多了去了,常见的有以下几种: $.get方法,$.post方法,$.getJson方法,$.ajax方法如下 前两种使用方法基本上一样 下面介绍全页面刷新方法:有时候可能会用到 ...
- swift如何打印对象的地址
swift如何打印对象的地址 打印对象的地址还是有着很多实用价值的,在swift中,你可以用以下的方式打印一个对象的地址: 打印结果: 有时候,if let a = b 这种操作会给人一种错觉,认为 ...
- @private、@protected与@public三者之间的区别
@private.@protected与@public三者之间的区别 类之间关系图 @private只能够使用在声明的类当中,其子类也不能够使用用@private声明的实例变量 @protected只 ...