Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
El pseudo-element CSS ::-moz-range-progress
és una extensió de Mozilla, que representa la part inferior de la pista (és a dir, la ranura) en la qual l'indicador es llisca en un <input>
de type="range"
. Aquesta part correspon a valors inferiors al valor actualment seleccionat pel polze (és a dir, botó virtual).
Nota: L'ùs de ::-moz-range-progress
amb qualsevol cosa que no sigui <input type="range">
no coincideix amb res i no té cap efecte.
Sintaxi
::-moz-range-progress
Exemple
HTML
<input type="range" min="0" max="100" step="5" value="50"/>
CSS
input[type=range]::-moz-range-progress {
background-color: green;
height: 1em;
}
Resultat
Una barra de progrés que utilitzi aquest estil pot semblar una cosa així:
Especificacions
No forma part de cap especificació. Es tracta d'un pseudo-element propietari, específic en Gecko.
Navegadors compatibles
Descripció | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Suport bàsic | (Yes) | No support | No support | No support | No support |
Descripció | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Suport bàsic | (Yes) | No support | No support | No support | No support |
Vegeu també
- Pseudo-elements utilitzats per Gecko per dissenyar altres parts d'un interval d'entrada:
::-moz-range-thumb
representa l'indicador que es llisca a la ranura.::-moz-range-track
representa la ranura en què es llisca el polze.
- Pseudo-elements similars utilitzats per altres navegadors:
::-ms-fill-upper
, pseudo-element compatible amb Internet Explorer i Edge.
- Trucs CSS: Estil de les entrades de rang compatible entre navegadors amb CSS.
- QuirksMode: Controls lliscants disseny i scripts.