复选框在Opera中查看

Question

我有深色背景的页面。在IE，Firefox，Chrome和Safari中，我的复选框如下所示：

但Opera会显示如下所示的复选框：

因此用户无法查看是否选中了复选框，因为勾号（复选标记）也是黑色。

这是我的css的一部分：

body {
    background-attachment: fixed;
    background-color: #07080A;
    background-image: url('images/bg.jpg');
    background-position: center top;
    background-repeat: no-repeat;
    border: 0 none;
    color: #FFFFFF;
    display: block;
    font-family: Arial;
    font-size: 13px;
    margin: auto auto;
    width: 1000px;
}

input, textarea {
    width: 300px;
    color: #fff;
    background-color: #323232;
    border: none;
    font-size: 13px;
    font-family: Arial;
    padding: 8px 0px 8px 10px;
}

input[type="checkbox"]{
    background: transparent;
    width: 30px;
}

我该如何改变？我希望在Opera和其他浏览器中出现相同的复选框。

Answer 1

尝试使用以下方式覆盖您的第一个样式：

input[type="checkbox"] {
    background: inherit;
    width: 30px;
}

这将为复选框提供其父级的背景。根据规则和其他规则的顺序，您可能需要使用inherit !important。

Answer 2

在Opera中，background属性适用于复选框内的背景而不是复选框外的背景。我相信您要解决的问题是find on this page about how checkboxes are styled可以解决的一些问题。

Answer 3

input[type="checkbox"]{
    backgorund: #fff;
    width: 30px;
}

这不适合你吗？

Answer 4

首先，输入[type =“checkbox”]行中有一个拼写错误。

其次，根据this，您可以明确将复选框背景设置为白色。这适用于Opera。