MUI学习04-开关按钮

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;
}

效果：

 

转载于:https://www.cnblogs.com/wuss/p/7802634.html