CSS

::-moz-range-progress

::-moz-range-progress

非标准

这个功能是非标准的,不在标准轨道上。不要在面向 Web 的生产站点上使用它:它不适用于每个用户。实现之间也可能存在很大的不兼容性,并且行为在未来可能会发生变化。

::-moz-range-progress CSS伪元件是Mozilla的扩展,它表示的下部轨道(即,槽),其中在所述指示器滑动<input>的type="range"。该部分对应于低于拇指当前选择的值(即,虚拟旋钮)的值。

注意:使用::-moz-range-progress任何东西,但一个<input type="range">不匹配任何东西,没有任何效果。

语法

::-moz-range-progress

示例

HTML

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

CSS

input[type=range]::-moz-range-progress {   background-color: green; height: 1em; }

结论

A progress bar using this style might look something like this:

特征

不是任何规格的一部分。这是 Gecko 特有的专有伪元素。

浏览器兼容性

FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support(Yes)No supportNo supportNo supportNo support

FeatureFirefox Mobile (Gecko)AndroidIE PhoneOpera MobileSafari Mobile
Basic support(Yes)No supportNo supportNo supportNo support

Edit this page on MDN