DIV+CSS中复选框的背景颜色不显示,但是边框显示,为什么?

2024-11-30 09:54:17
推荐回答(3个)
回答1:

原生的checkbox样式不能满足咱们的需求。所以换种方式美化一下

首先,我们需要把checkbox的透明度设置为0: opacity: 0; 然后我们需要用到span,作为checkbox的选中状态显示。接着span一个背景icon,然后根据icon的分辨率尺寸大小设置背景图片的一些属性,关键是它: background-position-y: 20px;,目的是:当checkbox 未选中的时候,让背景图片挪到一个我们看不见的地方去,当checkbox 选中的时候,让背景图片再挪回来,也就是重置为0:background-position-y: 0px;,剩下的就是给它一个过渡效果,用户体验就更好啦,最后这样就达到我们的目的啦,具体代码如下:

完整代码:

checkbox美化

回答2:

复选框是 type="checkbox".

aaa

bbb

我试了一下,checkbox定义的border和bg都无效。

所以如果是想要给后面的字加bg和border的话,那就填个好了

如果是要给前面那个选框添加背景什么的,要不就填个

把它放进去,然后给
定义样式?我没试过,你可以试试。

回答3:

你是怎么写的?
例如:

这样就可以了!
希望能帮到你!