Etiqueta <progress> de HTML

  • Página anterior <pre>
  • Página siguiente <q>

Definición y uso

<progress> La etiqueta representa el progreso de la tarea.

Consejo:Siempre añada <label>Etiqueta ¡Para obtener las mejores prácticas de accesibilidad!

Por favor, consulte también：

Manual de referencia del DOM HTML：Objeto Progress

Ejemplo

Mostrar barra de progreso：

<label for="file">Descarga de progreso：</label>
<progress id="file" value="32" max="100"> 32% </progress>

Pruebe usted mismo

Consejos y notas

Consejo:Tenga en cuenta que <progress> La etiqueta se puede usar junto con JavaScript para mostrar el progreso de la tarea.

Nota:<progress> La etiqueta no es adecuada para representar instrumentos (por ejemplo, el uso del espacio en disco o la relevancia de los resultados de la consulta). Para representar instrumentos, utilice la etiqueta <meter>.

Atributo

Atributo Valor Descripción
max Número Define la cantidad total de trabajo necesario para la tarea. El valor predeterminado es 1.
value Número Define la parte de la tarea completada.

Atributos globales

<progress> La etiqueta también admite Atributos globales en HTML.

Atributos de eventos

<progress> La etiqueta también admite Atributos de eventos en HTML.

Configuración CSS predeterminada

Ninguno.

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que admite completamente la etiqueta.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
8.0 10.0 16.0 6.0 11.0
  • Página anterior <pre>
  • Página siguiente <q>