HTML - Element: <progress>
Der <progress>-Tag (HTML 5) zeigt eine Fortschrittsanzeige oder einen Bearbeitungsschritt an.
Mit dem Attribut max=""
wird die maximale Schrittweite angegeben und mit
value=""
der aktuelle Bearbeitungsschritt (<meter>).
Je nach Browser und Betriebssystem sieht die Anzeige anders aus.
![]() |
![]() |
![]() |
---|---|---|
Mozilla Firefox / Windows 10 | Microsoft Edge / Windows 10 | Google Chrome / Opera / Windows 10 |
<!DOCTYPE html> <html> <head> <title>Fortschrittsanzeige</title> </head> <body> <h1>Fortschrittsanzeige</h1> <p> <progress></progress> <br> <progress max="4" value="1">Schritt 1 / 4</progress> <br> <progress max="4" value="2">Schritt 2 / 4</progress> <br> <progress max="4" value="3">Schritt 3 / 4</progress> <br> <progress max="4" value="4">Schritt 4 / 4</progress> </p> </body> </html>
Der <progress>-Tag kann nicht mit CSS formatiert werden!
Bausteine Alle Anzeigen
Eine zufällige Auswahl von Codeschnipseln
aus den Bereichen
HTML, CSS,
PHP, JavaScript und
MySQL.
<legend> Gruppenüberschrift
CSS - Nur gefüllte Tabellenzellen hervorheben
PHP - Verzeichnisgröße auslesen