Ajouté dans HTML5
Résumé
L'élément HTML<progress>
est utilisé pour visualiser l'avancement d'une tâche. Les spécificités de l'affichage sont gérées par le navigateur. Dans la majeure partie des cas, le navigateur affiche une barre de progression.
- Catégories de contenu Contenu de flux, contenu phrasé, contenu étiquetable, contenu tangible.
- Contenu autorisé Contenu phrasé tant que celui-ci n'a pas d'élément
<progress>
parmi ses descendants. - Omission de balises Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires
- Éléments parents autorisésTout élément acceptant du contenu phrasé.
- Interface DOM
HTMLProgressElement
Attributs
Cet élément inclut les attributs globaux.
max
- Cet attribut décrit le niveau maximal de progression à atteindre pour compléter une tâche.
value
- Cet attribut définit le niveau de progression actuel (autrement dit, quelle fraction de la tâche a été effectuée). Il doit être compris entre 0 et
max
, ou entre 0 et 1.0 simax
n'est pas utilisé. S'il n'y a pas d'attributvalue
, la barre de progression est indéterminée. Cela indique qu'une activité est en cours, sans pouvoir renseigner sur le temps qui reste jusqu'à sa complétion.
Vous pouvez utiliser la propriété CSS orient
pour spécifier si la barre de progression doit être dessinée horizontalement (le comportement par défaut) ou verticalement. La pseudo-classe :indeterminate
peut être utilisée pour manipuler les barres de progression indéterminées.
Exemple
<progress value="70" max="100">70 %</progress>
Résultat
Sur Mac OS X, l'élément résultant ressemble à ceci :
Sur Windows, il ressemble à cela :
Exemples supplémentaires
Voir orient
.
Spécifications
Spécification | Statut | Commentaires |
---|---|---|
WHATWG HTML Living Standard La définition de '<progress>' dans cette spécification. |
Standard évolutif | |
HTML5 La définition de '<progress>' dans cette spécification. |
Recommendation |
Compatibilité des navigateurs
Fonctionnalité | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Support simple | 6.0 | 6.0 (6.0) [1][2] | 10 | 11.0 | 5.2 |
Fonctionnalité | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Support simple | Yes | 6.0 (6.0) [1][2] | Pas de support | 11.0 | Pas de support |
Notes relatives à Gecko
[1] Gecko fournit le pseudo-élément ::-moz-progress-bar
. Il permet de définir l'apparence de l'intérieur de la barre de progression (représentant la fraction de la tâche qui a été effectuée jusqu'à présent).
[2] Avant Gecko 14.0 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11), l'élément <progress>
était classé, de manière incorrecte, comme un élément de formulaire. , il avait donc un attribut form
. Ce problème a été résolu.