15,321
个编辑
文学领主/style.css：修订间差异
跳到导航
跳到搜索
小
无编辑摘要
无编辑摘要 |
小无编辑摘要 |
||
| 第9行： | 第9行： | ||
} | } | ||
.switch_demo { | |||
width: | position: relative; | ||
width: 150px; | |||
-webkit-user-select: none; | |||
-moz-user-select: none; | |||
-ms-user-select: none; | |||
} | |||
.switch_demo-checkbox { | |||
display: none; | |||
} | } | ||
.switch_demo-label { | |||
. | display: block; | ||
display: | overflow: hidden; | ||
cursor: pointer; | |||
border: 2px solid #999999; | |||
border-radius: 20px; | |||
} | } | ||
.switch_demo-inner { | |||
. | display: block; | ||
display: | width: 200%; | ||
margin-left: -100%; | |||
transition: margin 0.3s ease-in 0s; | |||
} | } | ||
.switch_demo-inner:before, | |||
.switch_demo-inner:after { | |||
display: block; | |||
float: left; | |||
width: 50%; | |||
height: 30px; | |||
padding: 0; | |||
line-height: 30px; | |||
font-size: 14px; | |||
color: white; | |||
font-family: Trebuchet, Arial, sans-serif; | |||
font-weight: bold; | |||
box-sizing: border-box; | |||
} | } | ||
.switch_demo-inner:before { | |||
. | content: "開啟"; | ||
padding-left: 10px; | |||
background-color: #34A7C1; | |||
color: #FFFFFF; | |||
} | } | ||
.switch_demo-inner:after { | |||
. | content: "關閉"; | ||
padding-right: 10px; | |||
background-color: #EEEEEE; | |||
color: #999999; | |||
color: # | text-align: right; | ||
} | } | ||
.switch_demo-switch { | |||
. | display: block; | ||
width: 18px; | |||
margin: 6px; | |||
background: #FFFFFF; | |||
position: absolute; | position: absolute; | ||
top: 0; | |||
bottom: | bottom: 0; | ||
right: 116px; | |||
border: 2px solid #999999; | |||
border-radius: 20px; | |||
transition: all 0.3s ease-in 0s; | |||
} | } | ||
.switch_demo-checkbox:checked + .switch_demo-label .switch_demo-inner { | |||
margin-left: 0; | |||
} | |||
.switch_demo-checkbox:checked + .switch_demo-label .switch_demo-switch { | |||
right: 0px; | |||
} | |||
/*原型取自萌娘百科-糖调! | /*原型取自萌娘百科-糖调! | ||