This page was translated from English by the community.Learn more and join the MDN Web Docs community.
<progress>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015년 7월.
HTML<progress> 요소는 어느 작업의 완료 정도를 나타내며, 주로 진행 표시줄의 형태를 띕니다.
시도해 보기
<label for="file">File progress:</label><progress max="100" value="70">70%</progress>label { padding-right: 10px; font-size: 1rem;}특성
이 요소는전역 특성을 포함합니다.
max<progress>요소가 나타내는 작업에 필요한 작업량. 지정하는 경우, 반드시 0보다 크고 유효한 부동소수점 숫자여야 합니다. 기본값은 1입니다.value<progress>요소가 나타내는 작업을 완료한 양. 유효한 부동소수점 숫자여야 하고,max특성을 지정한 경우 0 이상max이하, 그렇지 않으면 0 이상 1 이하여야 합니다.value특성이 없으면 미결정 상태로, 현재 작업의 종료 시점을 예측할 수 없음을 나타냅니다.
참고 :<meter> 요소와 달리, 최솟값은 항상 0이며min 특성을 지정할 수 없습니다.
참고 :CSS:indeterminate의사 클래스를 사용하면 미결정 상태의 진행 표시줄을 선택할 수 있습니다. 값을 지정한 진행 표시줄을 미결정 상태로 바꾸려면element.removeAttribute('value')를 사용해value 특성을 제거해야 합니다.
예제
<progress value="70" max="100">70 %</progress>결과
명세
| Specification |
|---|
| HTML # the-progress-element |