<progress>

HTML тег <progress> використовується для відображення прогресу завершеності завдання.

Зміна значення цього елемента відбувається через JavaScript.

Якщо вказати тег <progress> без атрибутів, то прогрес буде анімований у вигляді бігунка, який бігає з однієї стороди до іншої. Це зазвичай використовується доки відповідь від сервера не отримана чи триває обчислення результату.

Вид елемента <progress> залежить від браузера і операційної системи і може досить сильно відрізнятися між собою.

У тега <progress> використовується два основних атрибуту це max, який визначає загальний обсяг поточного процесу (його значення повинно бути позитивним) і value, який вказує вже виконану частину. Даний тег не підтримується браузером Internet Explorer версії 9 і нижче.

c882ae94b7b45f91f9b1c3d7bbaee430.png

Нотатка:

Тег <progress> не підходить для відображення статистики (наприклад, використання дискового простору або релевантність запиту). Для таких цілей використовуйте тег <meter>. Порада: Використовуйте тег <progress> в поєднанні з JavaScript для відображення ходу виконання завдання.

Синтакс

<progress value="<число>" max="<число>">
Текст
</progress>

Приклади

Найпростіший приклад використання HTML тега <progress>

До попереднього тегу До наступного тегу