<分区>
我一直在尝试更改 select 属性中选项的默认背景白色,但没有成功。我试图为我的选择属性添加一个 rgba 颜色,但它不接受它和我的背景图像(下拉箭头),所以我用一个 div 包裹它并给它我的背景 rgba 颜色,你可以在这里看到:
<div class="language-dropdown">
<label>
<select class="language-select">
<option class="language-option" selected>English</option>
<option class="language-option">Italian</option>
<option class="language-option">Russian</option>
</select>
</label>
</div>
当我尝试将背景 rgba 赋予 .language-option 时,它不会改变任何东西,但是,如果我给它一个常规颜色,例如 background:red;,它会起作用。
.language-dropdown {
background: rgba(255, 255, 255, 0.4);
display: inline-block;
}
.language-select {
background: url("http://s10.postimg.org/otetjsoat/language_Arrow.png") no-repeat right;
background-size: auto 42%;
width: 88px;
background-position-x: 73px;
-webkit-appearance: none;
-moz-appearance: none;
color: #fff;
border: none;
text-indent: 0.01px;
padding-left: 5px;
}
.language-option {
background-color: rgba(255, 255, 255, 0.4);
/*WONT WORK!!! , but "background-color:red;" will*/
}
注意:适用于 Firefox,但不适用于 Chrome!
你可以找到我的整个 fiddle here