Mint Switch Test
Mint Switch Test
by Wemlin
HTML
<link rel="stylesheet" href="//at.alicdn.com/t/font_1469597443_9221172.css">
<link rel="stylesheet" href="http://elemefe.github.io/mint-ui/app.dbbcf59.css">
<body>
<div><a href="/" class="page-back router-link-active"><i class="mintui mintui-back"></i></a> <div class="page-switch"><div class="page-title">Switch</div> <div class="page-part page-switch-padding"><div class="mint-switch"><input type="checkbox" class="mint-switch-input"> <span class="mint-switch-core"></span> <div class="mint-switch-label"><label>false</label></div></div></div> <div class="page-part page-switch-padding"><div class="mint-switch"><input type="checkbox" class="mint-switch-input"> <span class="mint-switch-core"></span> <div class="mint-switch-label"><label>true</label></div></div></div> <a class="mint-cell"><!----> <div class="mint-cell-left"></div> <div class="mint-cell-wrapper"><div class="mint-cell-title"><!----> <span class="mint-cell-text">选项 true</span> <!----></div> <div class="mint-cell-value"><div class="mint-switch"><input type="checkbox" class="mint-switch-input"> <span class="mint-switch-core"></span> <div class="mint-switch-label"></div></div></div></div> <div class="mint-cell-right"></div> <!----></a> <a class="mint-cell"><!----> <div class="mint-cell-left"></div> <div class="mint-cell-wrapper"><div class="mint-cell-title"><!----> <span class="mint-cell-text">选项 false</span> <!----></div> <div class="mint-cell-value"><div class="mint-switch"><input type="checkbox" class="mint-switch-input"> <span class="mint-switch-core"></span> <div class="mint-switch-label"></div></div></div></div> <div class="mint-cell-right"></div> <!----></a></div></div>
</body>
CSS
html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: transparent;
height: 100%
}
body {
margin: 0;
font-size: 14px;
font-family: Helvetica Neue,Helvetica,STHeiTi,Arial,sans-serif
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
display: block
}
audio:not([controls]) {
display: none;
height: 0
}
progress {
vertical-align: baseline
}[hidden],template {
display: none
}
a {
background-color: transparent;
-webkit-text-decoration-skip: objects;
text-decoration: none
}
a:active,a:hover {
outline-width: 0
}
abbr[title] {
text-decoration: underline;
text-decoration: underline dotted
}
b,strong {
font-weight: bolder
}
dfn {
font-style: italic
}
small {
font-size: 80%
}
sub,sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}
sup {
top: -.5em
}
sub {
bottom: -.25em
}
img {
border-style: none
}
svg:not(:root) {
overflow: hidden
}
code,kbd,pre,samp {
font-family: monospace,monospace;
font-size: 1em
}
pre {
overflow: auto;
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word
}
button,input,optgroup,select,textarea {
color: inherit;
font: inherit;
margin: 0;
vertical-align: middle
}
button,input {
overflow: visible
}
button,select {
text-transform: none
}[type=reset],[type=submit],button,html [type=button] {
-webkit-appearance: button
}[disabled] {
cursor: default
}[type=checkbox],[type=radio] {
box-sizing: border-box;
padding: 0
}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
height: auto
}[type=search] {
-webkit-appearance: textfield;
outline-offset: -2px
}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration {
-webkit-appearance: none
}
::-webkit-file-upload-button...