html - 在单选按钮上设置边框和背景颜色(与 Firefox、Chrome、Safari 兼容)

Question

如何在 Firefox、Safri 和 Chrome 下为单选按钮设置边框和背景色？

我知道它只适用于 IE。

下面是带有红色边框 + 红色背景的 IE 截图。

下面是带有红色边框 + 红色背景的 Chrome 截图。

如您所见，未显示边框和背景。

这是我的CSS:

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

谢谢。

Answer 1

因为这是浏览器的系统对象，所以不推荐甚至不可能仅通过 css 来设置它们的样式。外面有很多插件和其他解决方案可以解决这样的问题，比如我最喜欢的:

在具有不同类别(选中和未选中)的 div 上使用背景图像来模拟单选按钮或复选框。如果单击此“按钮”之一，则通过 javascript 或 jquery 动态添加/删除输入类型隐藏。