input实用技巧: 自定义勾选框图片, 自定义多选与单选. checkbox & radio

<input type="radio" name="sex" value="男" >男
<input type="radio" name="sex" value="女"  >女

<input type="checkbox" title="吃饭" >吃饭
<input type="checkbox" title="睡觉" >睡觉
<input type="checkbox" title="打豆豆">打豆豆

h5:
<span class="cheSpan">
   <input type="radio" class="check" id="aaa" name="card">
   <label for="aaa"></label>
</span>

css 
.cheSpan {
            position: relative;
            margin-right: 37px;
          }

          .cheSpan .check {
            position: absolute;
            width: 16px;
            height: 16px;
            visibility: hidden;
          }

          .cheSpan .check+label {
            display: inline-block;
            width: 16px;
            height: 16px;
            background: url("../images/emptyPoint.png") no-repeat center center;
            border: 1px solid #898989;
            border-radius: 50%;
            margin-bottom: -3px;
            cursor: pointer;
          }

          .cheSpan .check:checked+label {
            background: url("../images/clickPoint.png") no-repeat center center;
            background-size: 16px 16px;
          }