1. Поддержка браузерами
  2. Синтаксис
  3. Атрибуты
  4. Спецификации
  5. Описание и примеры

<progress>

Тег <progress> (от англ. progress – прогрес) используется для отображения прогресса завершённости задачи.

Изменение значения происходит через JavaScript.

Вид элемента зависит от браузера и операционной системы и может довольно сильно различаться между собой.

Поддержка браузерами

Can I Use progress? Data on support for the progress feature across the major browsers from caniuse.com.

Полифилы для включения поддержки:

Синтаксис

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

Закрывающий тег обязателен.

Атрибуты

  • value – Текущее значение прогресса.
  • max – Максимальное значение прогресса.

Спецификации

Описание и примеры

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>progress</title>
  </head>
  <body>
    <p>Пожалуйста, подождите, фотографии загружаются.</p>
    <progress max="100" value="25">Загружено на <span id="value">25</span>%</progress>
  </body>
</html>