6. 自定义checkbox样式

  -通过 / -执行

checkbox的默认样式大多数时候都不是我们想要的,这个问题中请实现不同的样式。

  1. 未选择时显示灰色原点('color: gray')
  2. 已选择时显示绿色圆点('color: green')

原点半径5px,请不要添加额外的padding等空白。

<label class="my-checkbox">
  <input type="checkbox" />
  <span>a checkbox</span>
</label>

1.未选择时

2.选择时