自己做一个css复选框

<!DOCTYPE>
<meta charset='UTF-8' />

<style>
	 
.span_my_checkbox {
	display:inline-block;
	border:1px solid limegreen;
	position:relative;
	padding:10px;
	text-align:center;
	width:100px;
}
	
.span_my_yes {
	width: 0;
	height: 0;
	position:absolute;
	bottom:0;
	right:0;
	border-bottom: 15px solid limegreen;
	border-left: 30px solid transparent;
}

.span_my_yes:after {
	content:'';
	position:absolute;
	right:5;
	width:5px; height:10px;
	top:2;
	border:1px solid white;
	border-top:0;
	border-left:0;
	background:transparent;
	-webkit-transform: rotate(35deg);
	-moz-transform: rotate(35deg);
	-o-transform: rotate(35deg);
	-ms-transform: rotate(35deg);
	transform: rotate(35deg);
}

</style>
 


<span class='span_my_checkbox' >
苹果
<span class='span_my_yes'></span>
</span>

<span class='span_my_checkbox' >
梨子
<span class='span_my_yes'></span>
</span>