::-moz-range-progress

Nicht standardisiert: Diese Funktion ist nicht standardisiert und befindet sich nicht auf dem Weg zur Standardisierung. Verwenden Sie sie nicht auf Produktionsseiten, die dem Web ausgesetzt sind: Sie funktioniert nicht für alle Benutzer. Es kann auch große Inkompatibilitäten zwischen Implementierungen geben, und das Verhalten kann sich in Zukunft ändern.

Das ::-moz-range-progress CSS Pseudo-Element ist eine Mozilla-Erweiterung, die den unteren Teil der Spur (d.h. Rille) darstellt, in der der Indikator in einem <input> vom type="range" gleitet. Dieser Abschnitt entspricht Werten, die niedriger sind als der Wert, der derzeit durch den Daumen (d.h. virtueller Knopf) ausgewählt wurde.

Hinweis: Die Verwendung von ::-moz-range-progress mit etwas anderem als einem <input type="range"> führt zu keinem Treffer und hat keine Wirkung.

Syntax

css
::-moz-range-progress {
  /* ... */
}

Beispiele

HTML

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

CSS

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

Ergebnis

Eine Fortschrittsanzeige mit diesem Stil könnte folgendermaßen aussehen:

Die Fortschrittsleiste ist ein dicker grüner Balken links vom Daumen und eine dünne graue Linie rechts davon. Der Daumen ist ein Kreis mit einem Durchmesser in der Höhe des grünen Bereichs.

Spezifikationen

Nicht Teil eines Standards.

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch