1、打开网页开发工具，新建一个HTML文件
2、编写HTML：表单复选框
3、编写CSS：复选框的样式
4、编写CSS部分：复选框选中后的样式
5、最好打开浏览器预览效果，满意保存即可！
6、完整代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>CSS怎么修改表单复选框checkbox的样式</title>
<style type="text/css">
#fxk{
width: 16px; height: 16px; background-color: #fff;
border: 1px solid #c9c9c9; border-radius: 2px;
color: #fff; text-align: center; line-height: 15px;
-webkit-appearance:none; appearance:none; outline: none;
}
#fxk[type="checkbox"]:hover{ border: 1px solid #43adea;}
#fxk:checked {
color: #fff;background-color: #43adea; border: 1px solid #43adea;
}
#fxk:after {content: "\2713";}
</style>
</head>
<body style="padding: 50px;">
<label>原始复选框</label>
<input type="checkbox" value="复选框" />
<label>修改后复选框</label>
<input type="checkbox" value="复选框" id="fxk" />
</body>
</html>
1、新建HTML文件
2、边界HTML标签
3、编写CSS
4、打开浏览器浏览
