checkbox不能直接改变,需要用label标签中的for方法进行绑定
<input type="checkbox" id="input" >
<label for="input"></label>
css样式
label{
display: block;
width: 20px;
height: 20px;
cursor: pointer;
position: absolute;
top: 452px;
left: 434px;
border: 2px solid #ff5c00;
}
#input:checked +label::before{
display: block;
content:"\2713";
text-align: center;
font-size: 27px;
color: #ff5c00;
margin: -12px 2px;
}
input[type=checkbox]{
visibility: hidden;
}