has changed the default style of radio. Now how to implement the original label binding text function?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
.change-radio{
position: relative;
line-height: 30px;
}
input[type="radio"] {
width: 20px;
height: 20px;
opacity: 0;
}
label {
position: absolute;
left: 5px;
top: 3px;
width: 20px;
height: 20px;
border-radius: 50%;
border: 1px solid -sharp999;
}
/*input*/
/* + ,label*/
input:checked+label {
background-color: -sharpfe6d32;
border: 1px solid -sharpfe6d32;
}
input:checked+label::after {
position: absolute;
content: "";
width: 5px;
height: 10px;
top: 3px;
left: 6px;
border: 2px solid -sharpfff;
border-top: none;
border-left: none;
transform: rotate(45deg)
}
.list{
display:flex;
}
</style>
</head>
<body>
<div class="list">
<div class="list-text"></div>
<div class="change-radio">
<input id="item1" type="radio" name="item" value="" checked>
<label for="item1"></label>
<span></span>
</div>
</div>
<div class="list">
<div class="list-text"></div>
<div class="change-radio">
<input id="item2" type="radio" name="item" value="" checked>
<label for="item2"></label>
<span></span>
</div>
</div>
</body>
</html>