a-checkbox修改样式
时间: 2023-07-29 21:07:29 浏览: 256
改变checkbox样式插件
4星 · 用户满意度95%
要修改 checkbox 的样式,可以使用 CSS。下面是一个简单的例子:
HTML 代码:
```
<input type="checkbox" id="myCheckbox">
<label for="myCheckbox">这是一个复选框</label>
```
CSS 代码:
```
input[type="checkbox"] {
display: none; /* 隐藏原生的 checkbox */
}
label {
display: inline-block;
padding: 5px 10px;
background-color: #ddd;
border-radius: 5px;
cursor: pointer;
}
input[type="checkbox"]:checked + label {
background-color: #4CAF50;
color: #fff;
}
```
上面的代码将原生的 checkbox 隐藏了,然后使用 label 代替 checkbox 显示。当 checkbox 被选中时,将修改 label 的样式,使其背景色变为绿色。你可以根据自己的需求修改 CSS 样式。
阅读全文