CSS   发布时间:2022-04-17  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了CSS -webkit-appearance:none;导致复选框不被选中大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
所有,
我有一个复选框,我将以下CSS样式应用于:
-webkit-appearance: none;

同样的代码在我的一些文本字段上,这些仍然可以继续正常工作.为什么此功能导致不允许选中复选框?

我喜欢这种方式的复选框样式,但仍需要功能才能工作.如果我将代码更改为:

-webkit-appearance: checkbox;

它显示标准复选框.有任何想法吗?这是一个用于演示目的的JS小提琴:
http://jsfiddle.net/VWC76/

解决方法

你刚刚在WebKit上修改了所有类型的复选框,所以是的,你无法看到它们是否被选中(它们仍然存在,对于没有屏幕阅读器的视力正常的人来说,它是不可见的).

您需要使用:checked pseudo:http://jsfiddle.net/VWC76/450/设置已检查状态的样式

input[type=checkbox]:checked {
    BACkground-color: red;
    /* or whatever styles you want depending on your design */
    /* be as obvious as possible that it's a checkbox and that it's checked! */
}

编辑:

>外观:现在没有在WebKit / Blink(caniuse)之外存在.如果你做的比手工添加前缀更好,只需使用Autoprefixer

大佬总结

以上是大佬教程为你收集整理的CSS -webkit-appearance:none;导致复选框不被选中全部内容,希望文章能够帮你解决CSS -webkit-appearance:none;导致复选框不被选中所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。