Le tag <progress> est utilisé pour afficher l’indicateur de barre de progression (progress bar). Les valeurs dynamiquement changeant de progression de l’indicateur sont définies par les scripts (JavaScript).

L'apparence de l'élément peut varier en fonction du navigateur et du système d'exploitation.

Syntaxe

Le tag <progress> est apparié, donc le tag fermant est requis.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
  </head>
  <body>
    <span>Chargement:</span>
    <progress value="35" max="100"></progress>
  </body>
</html>

Résultat

Chargement

Attributs

Attribut Valeur Description
max number Spécifie la quantité maximale du processus en cours. La valeur peut être un nombre positif supérieur à zéro.
value number Définit la taille du travail déjà effectué. La valeur peut être un nombre compris entre 0 et le nombre spécifié dans l'attribut max, ou un nombre compris entre 0 et 1 si l'attribut max n'est pas spécifié.

Le tag <progress> supporte également les Attributs globaux et les Attributs d'événements.

Support de Navigateurs

chrome firefox safari opera
8+ 16+ 6+ 11+

Pratiquez vos connaissances

Qu'est-ce que la balise HTML <progress> et comment est-elle utilisée ?
Trouvez-vous cela utile?