如何设置input单选框、复选框的样式

412 阅读1分钟

系统的单选框和复选框的样式太丑了,我们通过设置背景图来实现。

效果图如下:

css代码:

input[type=radio]{    width: 0.4rem;    height: 0.4rem;    display: inline-block;    border:0;    margin-right: 0.1rem;    background:url(../../images/bigAmount/un_icon.png) no-repeat center;    background-size: 100% 100%;    vertical-align: middle;}input[type=radio]:checked{    background:url(../../images/bigAmount/act_radio.png) no-repeat center;    background-size: 100% 100%;}

这样就行了吗?

发现宽高是ok的,但背景图并没有生效。还有一个点:

input{    -webkit-appearance: none;}

要修改input的默认展现行为。