HTML代码如下:

<div class="mui-switch">
<div class="mui-switch-handle"></div>
</div>

引入JS:<script src="../js/mui.min.js"></script>

引入CSS:<link rel="stylesheet" href="../css/mui.min.css">

主要CSS修改说明:

.mui-switch{width:4.6em;height: 1.6em;}
.mui-switch .mui-switch-handle{width:1.3em;height: 1.3em;line-height: 1.6em; }
.mui-switch:before{
font-size: 9pt;
position: absolute;
top: -0.2em;
right: 0.7em;
content: 'Off';
text-transform: uppercase;
color: #999;
}

效果:

MUI学习04-开关按钮的更多相关文章

  1. Python学习--04条件控制与循环结构

    Python学习--04条件控制与循环结构 条件控制 在Python程序中,用if语句实现条件控制. 语法格式: if <条件判断1>: <执行1> elif <条件判断 ...

  2. JavaScript学习04 对象

    JavaScript学习04 对象 默认对象 日期对象Date, 格式:日期对象名称=new Date([日期参数]) 日期参数: 1.省略(最常用): 2.英文-数值格式:月 日,公元年 [时:分: ...

  3. Java虚拟机JVM学习04 类的初始化

    Java虚拟机JVM学习04 类的初始化 类的初始化 在初始化阶段,Java虚拟机执行类的初始化语句,为类的静态变量赋予初始值. 在程序中,静态变量的初始化有两种途径: 1.在静态变量的声明处进行初始 ...

  4. Thinkphp学习04

    原文:Thinkphp学习04 一.ThinkPHP 3 的输出      (重点) a.通过 echo 等PHP原生的输出方式在页面中输出 b.通过display方法输出   想分配变量可以使用as ...

  5. JVM学习04:类的文件结构

    JVM学习04:类的文件结构 写在前面:本系列分享主要参考资料是  周志明老师的<深入理解Java虚拟机>第二版. 类的文件结构知识要点Xmind梳理

  6. mui学习

      改变状态栏的颜色 <meta name="apple-mobile-web-app-capable" content="yes"> <me ...

  7. vue学习04 v-on指令

    vue学习04 v-on指令 v-on的作用是为元素绑定事件,比如click单击,dbclick双击 v-on指令可简写为@ 代码测试 <!DOCTYPE html> <html l ...

  8. Mybatis学习04

    title: Mybatis学习04 date: 2020-01-20 21:48:00 tags:Mybatis学习的第四篇笔记 这次的笔记主要是mybatis中的注解 <!--more--& ...

  9. mui学习记录

    1.页面间传值 2.mui如何增加自定义icon图标 http://ask.dcloud.net.cn/article/128 3.设计基于HTML5的APP登录功能及安全调用接口的方式(原理篇) h ...

  10. C语言范例学习04

    第三章 算法 前言:许多人对算法的看法是截然不同的,我之前提到过了.不过,我要说的还是那句话:算法体现编程思想,编程思想指引算法. 同时,有许多人认为简单算法都太简单了,应当去学习一些更为实用的复杂算 ...

随机推荐

  1. bzoj 4621: Tc605 动态规划

    题解: 一道比较简单的题目 想着想着就把题目记错了..想成了可以把某段区间覆盖为其中一个数 其实是比较简单的 每个点的贡献一定是一个区间(就跟zjoi2018那题一样) 然后问题就变成了给你n个区间让 ...

  2. 解决win7 安装完jdk7后,再安装jdk8出现的问题 has value '1.8', but '1.7' is required.

    http://blog.csdn.net/qiyueqinglian/article/details/46605759 电脑装了jdk8,JAVA_HOME也是设置的8. 不删除8变回7. 改了JAV ...

  3. 【Android】Android WebView 网页输入框获取焦点

    webView.setOnTouchListener(new OnTouchListener() { @Override public boolean onTouch(View v, MotionEv ...

  4. Codeforces 1136E Nastya Hasn't Written a Legend 线段树

    vp的时候没码出来.. 我们用set去维护, 每一块区域, 每块区域内的元素与下一个元素的差值刚好为ki,每次加值的时候我们暴力合并, 可以发现我们最多合并O(n)次. 然后写个线段树就没了. #in ...

  5. js读取cookie,并利用encrypt和decrypt加密和解密方法

    以下为支持encrypt和decrypt加密和解密方法 eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a ...

  6. Codeforces 852G Bathroom terminal 【Trie树】

    <题目链接> 题目大意: 现在给定出n个字符串,并且进行m此询问,每次询问给出一个匹配串,每次询问都给出该匹配串能够匹配的字符串个数(题目只出现字符'a'~'e').'?'可以看成任意字符 ...

  7. Google Hack搜索技巧

    想了解更多搜索技巧,点击下面网站了解http://exploit-db.com/google-dorks Google Hack的一些整理 这里是google关键字的用法,要设置它为中文,则是 htt ...

  8. P1168 中位数

    P1168 中位数树状数组+二分答案.树状数组就是起一个高效查询比二分出来的数小的有几个. #include<iostream> #include<cstdio> #inclu ...

  9. vs2010黑色主题Dark完美设置

    版权声明:本文为博主原创文章,未经博主允许不得转载.   ----------------------------------------------------------------------- ...

  10. 2109 ACM 排序

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=2109 题意:简单的排序问题 代码: #include<cstdio> #include< ...