搜狗繁体输入法下载-gmail电脑客户端
2023年4月5日发(作者：fn键的作用)
css3状态伪类选择器：checked修改按钮默认样式
在表单元素中，单选框和复选框都有选中和未选中状态，css3中可以通过状态伪类选择器：checked去修改按钮的默认样式
html代码
2023年4月5日发(作者：fn键的作用)
2023年4月5日发(作者：fn键的作用)
css代码
form{
border:1pxsolid#ccc;
padding:20px;
width:300px;
margin:30pxauto;
}
.wrapper{
margin-bottom:10px;
}
.box{
display:inline-block;
width:20px;
height:20px;
margin-right:10px;
position:relative;
border:2pxsolidorange;
vertical-align:middle;
}
.boxinput{
opacity:0;
}
.boxspan{
position:absolute;
top:-10px;
right:3px;
font-size:30px;
font-weight:30px;
font-family:Arial;
transform:rotate(30deg);
color:orange;
}
input[type='checkbox']+span{
opacity:0;
}
input[type='checkbox']:checked+span{
opacity:1;
}
最终效果：
发布评论