Html 自定义选择，css在Firefox中不起作用

我想更改选择框右角的按钮（向下箭头）。我的html如下所示：

<div class="buscaSelect">
    <select name="oper">
        <option value="value1">Value 1</option>
        <option value="value2">Value 2</option>
    </select>
</div>

在Safari中，结果是完美的，默认按钮被“btnSelect.png”更改，但在Firefox（58.0b9）中，默认按钮仍然存在，与我的按钮重叠。由于默认按钮的宽度变小，我的按钮的一角出现在后面。。。结果太糟糕了

---

如何停用Firefox默认按钮并仅显示我的按钮？

我想您正在寻找此按钮，希望它能有所帮助。我已经给出了有下拉箭头和没有下拉箭头的对比。webkit外观：没有一个能很好地与firefox和chrome配合使用，但对于IE，您可能需要使用：

select::-ms-expand {
    display: none;
}

.buscaSelect{
显示：内联块；
保证金：18px 0px 0px 0px；
宽度：120px；
高度：27px；
边界半径：0px；
溢出：隐藏；
背景：白色url（“btnSelect.png”）无重复右中心；
}
.总线选择{
填充：4px；
宽度：100%；
边界：无；
盒影：无；
背景：透明；
背景图像：无；
-webkit外观：无；
}
#诺罗{
-webkit外观：无；
-moz外观：无；
文本缩进：1px；
文本溢出：“”；
}
选择：：-ms展开{
显示：无；
}

值1
价值2
值1
价值2

提示：

-webkit外观

仅适用于基于webkit的浏览器（Chrome、Safari）。对于Firefox，您需要使用Gecko/Mozilla等价物：@Dai对于Firefox，还提供了-moz外观。你可以看看我的解决方案。所以webkit的mozilla等效代码丢失了！但是没有必要这样做#noarrow，另外，重点是创建一个select类，不能使用特定的id。此外，我认为我们应该包括ms等效项，我打赌有一个……这是一个示例来演示您。没有任何需要，但我想展示不同浏览器呈现方式的差异。如果您注意到了，我确实在顶部包含了它：select:：-ms expand{display:none；}@Gustavo如果这个解决方案对您有所帮助，请确保对其进行标记。干杯

select::-ms-expand {
    display: none;
}