No estándar
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.
Resumen
El pseudo-elemento CSS ::-webkit-progress-value
representa la parte rellena de la barra del elemento <progress>
. Es hija del pseudo-elemento ::-webkit-progress-bar
.
Nota: para que ::-webkit-progress-value
tenga efecto en el elemento <progress> -webkit-appearance
deberá tener none como valor.
Especificaciones
No es parte de ninguna especificación. Es un elemento propietario y específico de WebKit/Blink.
Ejemplo
Contenido CSS
progress {
-webkit-appearance: none;
}
::-webkit-progress-value {
background-color: orange;
}
Contenido HTML
<progress value="10" max="50">
Resultado
Una barra de progreso con el estilo indicado anteriormente será similar a esta:
Compatibilidad con los distintos navegadores
We're converting our compatibility data into a machine-readable JSON format.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
Find out how you can help!
Característica | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Soporte básico | Sin soporte | (Yes) | Sin soporte | (Yes) | (Yes) |
Característica | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Soporte básico | Sin soporte | (Yes) | Sin soporte | (Yes) | (Yes) |
Ver además
- Los pseudo-elemento de WebKit/Blink para dar estilos a otras partes de un elemento
<progress>
: ::-moz-progress-bar
::-ms-fill