checkbox，自定义样式

最新推荐文章于 2024-04-02 11:10:24 发布

张张的技术贴

最新推荐文章于 2024-04-02 11:10:24 发布

阅读量466

点赞数

分类专栏：表单 css 文章标签：前端 css html

本文链接：https://blog.youkuaiyun.com/zxp_smile/article/details/131210288

版权

css 同时被 2 个专栏收录

32 篇文章

订阅专栏

表单

10 篇文章

订阅专栏

input[type="checkBox"]
{
    visibility:hidden;
}
input[type="checkBox"]:after
{
    visibility:visible;
    content:'';
    display:block;
    background:#fff;
    width: 2rem;
    height: 2rem;
    line-height:20px;
    text-align:center;
    overflow:hidden;
    text-indent:-100px;
    border: 1px solid #999;
    border-radius: 50%;
}

input[type="checkBox"]:checked:after
{
    text-indent:0;
    background: url(../images/score-checked.png) no-repeat;
    background-size: 100% 100%;
    border: 1px solid transparent;
}