::-webkit-progress-value
Kein Standard: Diese Funktion ist nicht standardisiert und befindet sich nicht im Standardisierungsprozess. Verwenden Sie sie nicht auf Produktionsseiten, die auf das Web ausgerichtet sind: Sie wird nicht für alle Benutzer funktionieren. Außerdem kann es große Inkompatibilitäten zwischen Implementierungen geben und das Verhalten kann sich in Zukunft ändern.
Das ::-webkit-progress-value
CSS Pseudo-Element repräsentiert den ausgefüllten Teil der Leiste eines <progress>
-Elements. Es ist ein Kindelement des ::-webkit-progress-bar
-Pseudo-Elements.
Hinweis: Damit ::-webkit-progress-value
Wirkung zeigt, muss das appearance
auf none
für das <progress>
-Element gesetzt werden.
Syntax
::-webkit-progress-value {
/* ... */
}
Beispiele
Dieses Beispiel funktioniert nur in Browsern, die auf Blink oder WebKit basieren.
HTML
<progress value="10" max="50"></progress>
CSS
progress {
-webkit-appearance: none;
}
::-webkit-progress-value {
background-color: orange;
}
Ergebnis
Ergebnis-Screenshot
Eine Fortschrittsanzeige, die den obigen Stil verwendet, würde wie folgt aussehen:
Spezifikationen
Nicht Teil eines Standards.
Browser-Kompatibilität
BCD tables only load in the browser
Siehe auch
-
Die Pseudo-Elemente, die von WebKit/Blink verwendet werden, um andere Teile eines
<progress>
-Elements zu stylen: ::-moz-progress-bar