Question

根据我的上一个问题Radio button with custom image，

使用:before

请求自定义复选框的解决方案

@Tambo接受的解决方案如下。需要定制与同一解决方案模式上的复选框一起使用（智能和简洁）。感谢。

CSS

[type=radio]{
    position: relative;
    margin: 40px
}

[type=radio]:before{
    content: '';
    position: absolute;
    left: -15px;
    top: -15px;
    width: 32px;
    height: 32px;
    background: red
}

[type=radio]:checked:before{
    background: green
}

HTML

<input type=radio name=radio />
<input type=radio name=radio />
<input type=radio name=radio />

Answer 1

试试这个

＆＃13;

[type=checkbox]{
    position: relative;
    margin: 40px
}

[type=checkbox]:before{
    content: '';
    position: absolute;
    left: -15px;
    top: -15px;
    width: 32px;
    height: 32px;
    background: red
}

[type=checkbox]:checked:before{
    background: green
}

＆＃13;

<input type=checkbox name=radio />
<input type=checkbox name=radio />
<input type=checkbox name=radio />

＆＃13;

带有自定义图像的复选框

1 个答案: