HTML тег - progress - определение и примеры использования
Меню
Веб-разработка
Тег progress HTML

HTML - тег <progress> является одним из элементов HTML5. Он используется для отображения хода выполнения задачи (индикатор выполнения).


Тег <progress> - синтаксис и код

Тег <progress> представлен парами. Содержимое записывается между открывающим (<progress>) и закрывающим (</progress>) тегами.

Пример разметки для отображения индикатора выполнения:

<label for="file">Процесс загрузки:</label>
<progress id="file" value="32" max="100"> 32% </progress>

32%


Определение и использование

  • HTML - тег <progress> представляет ход выполнения задачи;
  • Динамически изменяющиеся значения индикатора выполнения должны быть определены с помощью скриптов (JavaScript);
  • Внешний вид элемента может отличаться в зависимости от браузера и операционной системы.
Рекомендация: всегда добавляйте тег <label>, чтобы обеспечить максимальную доступность!
Примечание: тег <progress> не подходит для представления показателей (например, использования дискового пространства или релевантности результата запроса). Чтобы представить датчик, используйте вместо него тег <meter>.

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

Chrome Поддерживает
Yandex Browser Поддерживает
Edge Поддерживает
Firefox Поддерживает
Safari Поддерживает
Opera Поддерживает

Атрибуты

Атрибут Значение Описание
max number Указывает минимальное значение диапазона. Значение по умолчанию — 0
value number Необходимый. Указывает текущее значение датчика

Глобальные атрибуты

Тег <progress> также поддерживает глобальные атрибуты в HTML

Атрибуты событий

Тег <progress> также поддерживает атрибуты событий в HTML


Связанные страницы

Руководство по HTML: введение в HTML


Настройки CSS по умолчанию

Отсутствуют.


Полный список всех доступных тегов HTML см. в Справочнике по тегам HTML.

 

Поделиться ссылкой