Etiqueta HTML <progreso>


Ejemplo

Mostrar una barra de progreso:

<label for="file">Downloading progress:</label>
<progress id="file" value="32" max="100"> 32% </progress>

Definición y uso

La <progress>etiqueta representa el progreso de finalización de una tarea.

Sugerencia: ¡ Agregue siempre la etiqueta <label> para conocer las mejores prácticas de accesibilidad!


Consejos y notas

Sugerencia: use la <progress>etiqueta junto con JavaScript para mostrar el progreso de una tarea.

Nota : la <progress>etiqueta no es adecuada para representar un indicador (por ejemplo, uso de espacio en disco o relevancia del resultado de una consulta). Para representar un indicador, utilice la etiqueta <meter> en su lugar.


Compatibilidad con navegador

Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el elemento.

Element
<progress> 8.0 10.0 16.0 6.0 11.0


Atributos

Attribute Value Description
max number Specifies how much work the task requires in total. Default value is 1
value number Specifies how much of the task has been completed

Atributos globales

La <progress>etiqueta también es compatible con los atributos globales en HTML .


Atributos de eventos

La <progress>etiqueta también es compatible con los atributos de eventos en HTML .


páginas relacionadas

Referencia HTML DOM: objeto de progreso


Configuración predeterminada de CSS

Ninguna.