progress

Introduced in HTML5

Resumo

o elemento HTML progress (<progress>) é usado para visualizar o progresso de uma tarefa. Embora as especifidades de como é mostrado ficam a cargo do desenvolvedor, tipicamente, é mostrado como uma barra de progresso.

Contexto de uso

Conteúdo permitido Conteúdo de texto
Omissão de Tag Nenhum, ambas as tags (abertura e encerramento) são obrigatórias
Elemento pai permitido Conteúdo fraseado (phrasing content), mas não deve haver descendentes do elemento progress
Documento normativo HTML5, seção 4.10.16

Atributos

Como todos os outros elementos HTML, este elemento tem os atributos globais (global attributes)

max
Este atributo descreve quanto trabalho é demandado pela tarefa indicada pelo elemento progress.
value
Este atributo especifica quanto da tarefa foi concluído. Se este não existir, a barra de progresso é indeterminada; isso indica que uma atividade está em progresso sem previsão de quanto tempo é esperado para que seja concluída.

Você pode usar a propriedade orient para especificar se a barra de progresso deve ser renderizada horizontalmente (padrão) ou verticalmente. A pseudo-classe :indeterminate pode ser associada a barras de progresso indeterminadas.

Interface DOM

Este elemento implementa a interface HTMLProgressElement.

Exemplos

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

Resultado

View Live Examples

No Mac OS X, o progresso resultante deve aparecer assim:

progress-1.png

No Windows, o progresso resultante deve aparecer assim:

progress-firefox.JPG

Exemplos adicionais

Veja orient.

Compatibilidade de Browsers

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suporte básico 6.0 6.0 (6.0) 10 11.0 Nightly build
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suporte básico Não suportado 6.0 (6.0) Não suportado 11.0 Não suportado

Gecko notes

O Gecko fornece o pseudo-elemento ::-moz-progress-bar, que permite que você customize a parte interior da barra de progresso, que representa a fração concluída do processo em determinado momento.

Gecko 14.0 note
(Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11)

Até o Gecko 14.0 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11), o elemento <progress> estava incorretamente classificado como um elemento de formulário, possuindo assim um atributo de formulário. Este erro foi corrigido.

Veja também

Etiquetas do documento e colaboradores

 Colaboradores desta página: teoli, Athos
 Última atualização por: teoli,