<分区>
<分区>
如何使用 css 更改复选标记的颜色？
<label style="color: #fff;">
<input type="checkbox" name="remember" value="1" class="remember">
<span></span>
</label>
最佳答案
我想这就是你想要的(仅限 CSS):
HTML:
<input type="checkbox" name="genres" value="adventure" id="adventure_id">
<label for="adventure_id" style="font-family: 'SExtralight'; font-size:14px;">Adventure</label>
CSS:
input[type="checkbox"]:checked + label::after {
content: '';
position: absolute;
width: 1.2ex;
height: 0.4ex;
background: rgba(0, 0, 0, 0);
top: 0.5ex;
left: 0.6ex;
border: 3px solid red;
border-top: none;
border-right: none;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
input[type="checkbox"] {
line-height: 2.1ex;
}
input[type="radio"],
input[type="checkbox"] {
position: absolute;
left: -999em;
}
input[type="checkbox"] + label {
position: relative;
overflow: hidden;
cursor: pointer;
}
input[type="checkbox"] + label::before {
content: "";
display: inline-block;
vertical-align: -25%;
height: 3ex;
width: 3ex;
background-color: white;
border: 1px solid rgb(166, 166, 166);
border-radius: 4px;
box-shadow: inset 0 2px 5px rgba(0,0,0,0.25);
margin-right: 0.5em;
}
关于css - 在css中更改复选框复选标记的颜色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48718128/