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 中解决这个问题？
不幸的是，你不能！（更新；你现在可以）
这是 Firefox 中的一个错误，除了修复源代码库本身（见下文）之外，没有其他解决方法可以解决这个问题。
另请参阅 Jonathan Watt 的博客（正在研究此问题）：
已知的问题：
- 默认的 CSS 样式外观仍然需要改进，并且原生主题（给滑块提供操作系统主题的外观）仍然存在......
在回复他博客中关于同样问题的评论时，他说：
现在你不能——对不起。我已经提交了错误932410以使其成为可能。
在撰写本文时，这方面似乎没有任何进展，也不知道何时会提供官方修复。
更新
自从发布此答案以来，该错误已得到修复。您现在可以使用（如其他答案中所述，但为了完整起见，我将其包含在此处）：
input[type=range]::-moz-focus-outer {
border: 0;
}
它可以用新版本的 Firefox 来完成。如此处所述，此错误已修复。因此可以隐藏外部虚线边框。为此，请将::-moz-focus-outer的边框设置为 0，如下所示：
input[type=range]::-moz-focus-outer {
border: 0;
}
这是工作示例：http: //jsfiddle.net/n2dsc/1/
-webkit-appearance: none;在 webkit 浏览器中，如果设置了外线将出现。要删除它，只需将:focus的轮廓设置为无，如下所示：
input[type=range]:focus {
outline: none;
}
这是工作示例：http: //jsfiddle.net/8b5Mm/1/
正如肯已经指出的那样，没有办法删除轮廓。但是，如果您知道父元素的背景颜色，则可以“隐藏”轮廓。假设白色背景，以下 CSS 将隐藏虚线轮廓：
input[type=range] {
border: 1px solid white;
outline: 2px solid white;
outline-offset: -1px;
}
您更新的示例：http: //jsfiddle.net/9fVdd/15/
如果您可以选择一个环绕元素（很可能您已经有一个环绕元素LI或P），您可以使用仅 FireFox 的 CSS 将输入定位在视图之外并将轨道/拇指重新定位在视图中。
translateX- 我认为 FireFox 使用它来实际滑动拇指 - 所以坚持使用translateYtranslateY(-1000em)） - 那么您将破坏键盘导航的可用性。给你：
HTML
<span class="range-wrap"><input type="range" /></span>
CSS
.range-wrap {
overflow: hidden;
}
input[type='range'] {
-moz-transform: translateY(-3em);
}
input[type='range']::-moz-range-track {
-moz-transform: translateY(3em)
}
input[type='range']::-moz-range-thumb {
-moz-transform: translateY(3em);
}
为了使它完整：该错误已被修复，现在它正在使用：
input[type=range]::-moz-focus-outer { border: 0; }
要从所有输入标签中删除所有轮廓，请使用：
input::-moz-focus-inner, input::-moz-focus-outer { border: none; }
如果应用了任何自定义样式，input[type='range']则 Firefox 使用不同的模型（测试版）来呈现范围输入。
您可以在此处查看 2 种不同的模型：
目前，我认为目前无法在 Firefox 中使用自定义 CSS 样式的输入范围框来遵守outline: 0;Firefox 27.0
虚线轮廓不是问题，它是浏览器显示输入元素被选中的方式。您可以将其设置tabIndex为 -1，这将阻止您的input元素将注意力集中在选项卡上，从而避免出现轮廓：
<input class="size" type="range" tabIndex="-1" name="size" min="1" max="6" value="6"></input>
但是这样做之后，您将失去一些键盘可访问性。最好有input元素键盘可访问。
这是小提琴：http: //jsfiddle.net/pF37g/14/
你不能。它似乎是 Firefox 中的一个错误。
它为范围元素制作了两个轮廓。一个可以通过 css 设置影响，另一个可以抵抗任何操作。
我将大纲设置为可见以显示问题：
input[type='range']:focus {
outline: 5px solid green;
}
在这里你可以看到它：
我在 Mozilla 的配置部分几乎没有研究添加这个
:-moz-any-link:focus {
outline: none;
}
a, a:active, a:visited, a:hover {
outline: 0;
}
然后
:focus {
outline: none;
}
然后
::-moz-focus-inner {
border: 0;
}
解决方案来了
:focus {
outline:none;
}
::-moz-focus-inner {
border:0;
}