Tag <progress>

Definições e uso

A tag <progress> representa o progresso de conclusão de uma tarefa.

Dica: Sempre adicione a tag <label> para as melhores práticas de acessibilidade.

Dica: Use a tag <progress> em conjunto com o JavaScript para exibir o progresso de uma tarefa.

Nota: A tag <progress> não é adequada para representar um medidor (por exemplo, uso de espaço em disco ou relevância de um resultado de consulta). Para representar um medidor, use a tag <meter>.

Exemplos


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


<!DOCTYPE html>
<html>
<body>

<h1>Tag progress</h1>

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

</body>
</html>

Resultado

Atributos

Atributo	Valor	Descrição
max	number	Especifica o quanto de trabalho a tarefa requer no total. O valor padrão é 1
value	number	Especifica quanto da tarefa já foi concluído

Esta tag também suporta Atributos Globais.