这个效果怎么通过css实现？

Question

如何通过css用代码实现，谢谢！

Answer 1

css：

.remem {
  display: none;
}
.remem + label {
  background:  url(../images/btn11.png) no-repeat;
  background-size: 100%;
  display: inline-block;
  position: relative;
  float: left;
  margin-top: 3px;
  width: 14px;
  height: 14px;
  margin-right: 10px;
}
.menlogin label{
  margin-left: 68px;
}
.remem:checked + label:after {
  content: ' ';
  width: 14px;
  height: 14px;
  position: absolute;
  background: url(../images/btn11-1.png) no-repeat;
  background-size: 100%;
}

html：

<input type="checkbox" name="" value="" checked="checked" class="remem" id="wtsx-radio-2">
 <label for="wtsx-radio-2"></label>
 <span>记住密码</span>
 

差不多就这样吧，我自己的笔记。

Answer 2

修改原生label样式，用CSS选择器：checked修改

Answer 3

我记得有个bootstrap的icheck 项目里也在用 挺简单 也挺坑的 用完源生的input直接废了 要用hasClass判断选中了没有。。