Checkbox 是一个 HTML 元素，用于接收用户的输入。虽然设置样式有点复杂，但是使用像 :before、:after、:hover 和 :checked 这样的伪元素，可以设置复选框的样式。为了设置复选框的样式，用户首先需要隐藏默认复选框，这可以通过将可见性属性的值设置为隐藏来完成。
示例 1：考虑使用 CSS 设置 HTML 复选框样式的示例。创建前三个复选框，然后隐藏默认复选框，并使用高度和宽度属性创建新复选框。将 height 和 width 属性设置为 25px 并将初始背景颜色设置为黑色。也可以使用 webkit 手动设置复选标记的样式。 “:checked”用于在复选框被选中后设置样式。当用户单击复选框时，背景颜色设置为绿色。
基本上，您应该通过考虑您希望复选框的样式设置不同的场景来进行处理，例如正常、活动、悬停或选中等。然后为每个场景指定在普通 CSS 中使用的不同样式。此外，还可以更改复选标记。
Best Computer Science Platform
输出： 
笔记：
- “~”是兄弟组合器，它选择前一个选择器前面的所有元素。
- 当用户将鼠标悬停在复选框上时，“:hover”用于设置复选框的样式。请注意，当鼠标指针移到复选框上时，它的颜色变为黄色。
- “:active”用于在复选框处于活动状态时为其设置样式。请注意，当单击复选框时，它会首先注意到红色，然后是绿色。
示例 2：考虑另一个对复选标记设计稍作修改的示例。
Style a checkbox using CSS
Is GeeksforGeeks Useful?
输出： 