0
点赞
收藏
分享

微信扫一扫

CSS3中伪类改造CHECKBOX样式

他说Python 2022-12-02 阅读 86


收藏个看到的技巧,在CSS3中,可以比如做到,原来CHECKBOX的是方的,变为圆形的;方法是使用伪类:

//html
<input type="checkbox" class="check">
//css
.check {
background-color: #8BC34A;
width: 40px;
-webkit-appearance: none;
appearance: none;
}
.check::after {
content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="-10 -18 100 135"><circle cx="50" cy="50" r="50" fill="none" stroke="#fff" stroke-width="3"/></svg>');
}

举报

相关推荐

0 条评论