<progress>

HTML <progress> 요소는 어느 작업의 완료 정도를 나타내며, 주로 진행 표시줄의 형태를 띕니다.

시도해보기

콘텐츠 카테고리 플로우 콘텐츠, 구문 콘텐츠, 레이블 가능, 뚜렷한 콘텐츠.
가능한 콘텐츠 구문 콘텐츠. 단, 다른 <progress> 요소는 사용할 수 없습니다.
태그 생략 불가능, 시작과 끝에 태그를 추가하는것은 필수입니다.
가능한 부모 요소 구문 콘텐츠를 허용하는 모든 요소.
가능한 ARIA 역할 없음
DOM 인터페이스 HTMLProgressElement (en-US)

특성

이 요소는 전역 특성을 포함합니다.

max

<progress> 요소가 나타내는 작업에 필요한 작업량. 지정하는 경우, 반드시 0보다 크고 유효한 부동소수점 숫자여야 합니다. 기본값은 1입니다.

value

<progress> 요소가 나타내는 작업을 완료한 양. 유효한 부동소수점 숫자여야 하고, max 특성을 지정한 경우 0 이상 max 이하, 그렇지 않으면 0 이상 1 이하여야 합니다. value 특성이 없으면 미결정 상태로, 현재 작업의 종료 시점을 예측할 수 없음을 나타냅니다.

참고: <meter> 요소와 달리, 최솟값은 항상 0이며 min 특성을 지정할 수 없습니다.

참고: CSS :indeterminate (en-US) 의사 클래스를 사용하면 미결정 상태의 진행 표시줄을 선택할 수 있습니다. 값을 지정한 진행 표시줄을 미결정 상태로 바꾸려면 element.removeAttribute('value')를 사용해 value 특성을 제거해야 합니다.

예제

<progress value="70" max="100">70 %</progress>

결과

명세

Specification
HTML Standard
# the-progress-element

브라우저 호환성

BCD tables only load in the browser

같이 보기