css - 从 Firefox 中的范围输入元素中删除虚线轮廓

Question

Firefox，自版本 23 起，原生支持 <input type="range">元素，但我不知道如何删除虚线轮廓。以下 CSS 无效:

input[type='range'], 
input[type='range']:focus, 
input[type='range']:active, 
input[type='range']::-moz-focus-inner, 
input[type='range']:-moz-focusring {
    border: 0;
    outline: none;
}

有人知道如何在 Firefox 中解决这个问题吗？

示例:https://jsfiddle.net/pF37g/

Answer 1

不幸的是，你不能! (更新；您现在可以)

这是 Firefox 中的一个错误，除了修复源代码库本身(见下文)外，没有其他解决方法可以解决此问题。

另请参阅 Jonathan Watt 的 blog (谁在做这件事):

Known issues:

• the default CSS styled appearance still needs work, and native theming (giving the slider the appearance of the operating system's theme) is still to come ...

在回复他的博客中关于同一问题的评论时，他说:

Right now you can't - sorry. I've filed bug 932410 to make that possible.

在撰写本文时，这方面似乎没有任何进展，也不知道何时可以使用官方修复程序。

更新

自发布此答案以来，错误已得到修复。您现在可以使用(如其他答案中所述，但为了完整起见，我将其包含在此处):

input[type=range]::-moz-focus-outer {
    border: 0;
    }