Html 在firefox中选择元素的边框

我想添加边框来选择元素

问题在于firefox（版本29.0.1）在箭头上添加了背景，我不希望这样，我希望箭头背景保持白色

您可以看到下面的代码（id为select 2的select是带边框的select）：

#选择2{边框：1px实心#999；}
选择1
选择2
选择3



选择1
选择2
选择3

还有小提琴

还有一张图片：

我希望firefox select元素看起来像chrome（select上的灰色边框和箭头上的白色背景）

---

谢谢

您可以使用此css和自定义图像进行下拉：

#select2 {
    border:1px solid #999;
    outline : none;
    overflow : hidden;
    text-indent : 0.01px;
    text-overflow :'';
    background : url("https://cdn2.iconfinder.com/data/icons/picol-vector/32/arrow_sans_down-16.png") no-repeat right 2px center;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    width:80px;//You can use custom dimension
}
select.#select2 :: -ms-expand {
    display: none;
}

演示：

您可以尝试以下方法：。但我不确定它是否能按你想要的方式工作。此外，您还可以为selectbox尝试此插件：

#select2 {
    border:1px solid #999;
    outline : none;
    overflow : hidden;
    text-indent : 0.01px;
    text-overflow :'';
    background : url("https://cdn2.iconfinder.com/data/icons/picol-vector/32/arrow_sans_down-16.png") no-repeat right 2px center;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    width:80px;//You can use custom dimension
}
select.#select2 :: -ms-expand {
    display: none;
}