input修改样式背景图片

input修改样式背景图片

<p class="choose" @click="additem(item,idx)">
   <input type="radio" name="a">
 </p>

style

	 .choose input {
	  width: 0.36rem;
	  height: 0.36rem;
	  /* appearance: none; */
	  position: relative;
	  outline: none;
	  background-image: url(../../assets/image/agree_gray.png);
	  background-size: 100%;
	  background-repeat: no-repeat;
	}
	.choose input:before {
	  content: "";
	  width: 0.36rem;
	  height: 0.36rem;
	  /* border: 1px solid #00d4d0; */
	  display: inline-block;
	  border-radius: 50%;
	  vertical-align: middle;
	  background-image: url(../../assets/image/agree_gray.png);
	  background-size: 100%;
	  background-repeat: no-repeat;
	}
	
	.choose input:checked:before {
	  content: "";
	  width: 0.36rem;
	  height: 0.36rem;
	  display: inline-block;
	  border-radius: 50%;
	  vertical-align: middle;
	  background-image: url(../../assets/image/agree_gray.png);
	  background-size: 100%;
	  background-repeat: no-repeat;
	}
	.choose input:checked:after {
	  background: #fff url(../../assets/image/checkedradio.png);
	  background-size: 100%;
	  background-repeat: no-repeat;
	  content: "";
	  width: 0.36rem;
	  height: 0.36rem;
	  text-align: center;
	  border-radius: 50%;
	  display: block;
	  position: absolute;
	  top: 0;
	  left: 0;
	}

效果图