将checkbox选中样式用图片替换

想在checkbox原先的样式上修改成以下样子比较困难，所以此处的主要思路是

关联一个span，通过checked来控制span的背景

 

 代码如下

html部分

<label class="check_part">
          <input
            type="checkbox"
            class="hide_real"
            checked="checked"
            name="agreement_check"
          />
          <span class="check_fake"></span>

          <span> 我已经仔细阅读过平台相关协议，并会遵守有关的法律法规</span>
        </label>

style部分

.main .agreement .check_part {
  margin: 20px 0 20px 0;
  display: flex;
  justify-content: flex-start;
  position: relative;
}
.check_part .check_fake {
  display: inline-block;
  width: 34px;
  height: 34px;
  margin: 0;
  background: