::-moz-range-thumb

非标准： 此功能是非标准的，不在标准轨道上。不要在面向 Web 的生产站点上使用它：它不会对所有用户都有效。实现之间也可能存在很大的不兼容，并且行为在未来可能会发生改变。

The ::-moz-range-thumb CSS 伪元素是一个 Mozilla 扩展，表示 <input> 的滑块（即虚拟旋钮）type="range"。用户可以沿输入的轨道移动滑块以更改其数值。

注意： 将 ::-moz-range-thumb 与除 <input type="range"> 之外的任何内容一起使用都不会匹配任何内容，也不会产生任何效果。

语法

css

::-moz-range-thumb {
  /* ... */
}

html

<input type="range" min="0" max="100" step="5" value="50" />

css

input[type="range"]::-moz-range-thumb {
  background-color: green;
}

使用此样式的进度条可能看起来像这样

不属于任何标准。

BCD 表格仅在浏览器中加载

Gecko 用于设置范围输入其他部分样式的伪元素
- ::-moz-range-track 表示滑块滑动的凹槽。
- ::-moz-range-progress 表示轨道的下部。
其他浏览器使用的类似伪元素
- ::-webkit-slider-thumb，WebKit 和 Blink（Safari、Chrome 和 Opera）支持的伪元素
CSS-Tricks：使用 CSS 设置跨浏览器兼容的范围输入的样式
QuirksMode：设置滑块的样式和脚本