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(基础版)完全免费,可以用于商业项目. 目录 ...
随机推荐
- CodeForces765C
C. Table Tennis Game 2 time limit per test:2 seconds memory limit per test:512 megabytes input:stand ...
- c语言中函数的形参test(int *&a)?
今天在看一段c代码的时候看到一个函数的形参是(int *&a)居然是这个东西,这让我好生疑惑啊,不知道用这么多的地址符号用意何在呢?传址么? 那也不必这样,只需要用指针完全能够达到这样的效果啊 ...
- Android 退出整个应用程序
我们在写android应用程序时,经常会遇到想退出当前Acitivity,或者直接退出应用程序.我之前的一般操作是按返回键,或者直接按home键直接返回,其实这两种操作都没有关闭当前应用程序,没有释放 ...
- Codeforces 750 F:New Year and Finding Roots
传送门 首先如果一开始就找到了一个叶子,那么暴力去递归找它的父亲,每次随机一个方向(除了已知的儿子)走深度次,如果走到了一个叶子就不是这个方向 (设根的深度为 \(1\))这样子最后到达深度为 \(3 ...
- ID3决策树算法实现(Python版)
# -*- coding:utf-8 -*- from numpy import * import numpy as np import pandas as pd from math import l ...
- C# 2个List<T>比较内部项是否相等(全部相等则相等,反之不相等)
static void Main(string[] args) { List<string> a = new List<string>() { "a", & ...
- JQuery和原生JavaScript实现网页定位导航特效
慕课网的一个小课程,练习了一遍,不足之处,欢迎指正(照片在本地,大家可以着重看代码哈): <!DOCTYPE html> <html lang="en"> ...
- Excel2010取消隐藏的工作簿
背景 Excel 2010文件,其中包含针对业务需要涉及的计算器等,其中一个Worksheet用于存放计算器用到的常量,针对业务人员(即此Excel文件的用户)是隐藏的,并有密码保护. 现象 因业务变 ...
- WPF 手机验证码 发送按钮倒计时 代码
private async void SendButton_Click(object sender, RoutedEventArgs e) { var button = sender as Butto ...
- 解决eclipse 文件更新不自动刷新的问题
打开eclipse 1. Window ===> Preferences ===> General ===> Workspace 2. 勾选 1> Refresh using ...