<progress>

by 2 contributors:

Introducido en HTML5

Sumario

La etiqueta HTML <progress> se utiliza para visualizar el progreso de una tarea. Aunque los detalles de como se muestran depende directamente del navegador que utiliza el cliente, aunque básicamente aparece una barra de progreso.

Atributos

Este elemento incluye Atributos Globales.

max
Este atributo indica la cantidad de trabajo que demorá la carga, se define en el elemento progress. Por ejemplo max="100".
value
 
Este atributo indica que parte de la tarea ya se ha completado o cargado. Debe especificarse un valor entre 0  y max, o entre 0 y 1.0 si max está omitido. Si al atributo value no se le especifica ningún valor, se estara llevando a cabo la tarea sin que el elemento mueste funcionamiento alguno. Por ejemplo si la carga está al 50% será de 0.5 el valor, en el caso de no especificar max. 

Puedes usar la propiedad CSS orient permite especificar la orientacion de la barra de progreso (horizontal o vertical) con horizontal por defecto. La pseudo-clase :indeterminate se puede utiliza para hacer que coincida con las barras de progreso indeterminadas.

Ejemplo

<progress value="70" max="100">70 %</progress>

Resultado

En Mac OS X, Se vería como esto:

progress-1.png

En Windows, el resultante sería este:

progress-firefox.JPG

Ejemplos adicionales

Mira orient.

Especificaciones

Especificación Status Comment
WHATWG HTML Living Standard
The definition of '<progress>' in that specification.
Living Standard  
HTML5
The definition of '<progress>' in that specification.
Candidate Recommendation

Compatibilidad en los navegadores

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 6.0 6.0 (6.0) [1][2] 10 11.0 5.2
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support Not supported 6.0 (6.0) [1][2] Not supported 11.0 Not supported

Gecko notas

[1] Gecko provides the ::-moz-progress-bar pseudo-element, which lets you style the part of the interior of the progress bar representing the amount of work completed so far.

[2] Prior to Gecko 14.0 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11), the <progress> element was incorrectly classified as a form element, and therefore had a form attribute. This has been fixed.

Mira también

Etiquetas y colaboradores del documento

Contributors to this page: teoli, rubencidlara
Última actualización por: teoli,