SoloLearn HTML 번역

HTML5 progress Element

Progress Bar

진행 표시 줄

• The <progress> element provides the ability to create progress bars on the web.
  • <progress> element는 웹에서 진행 표시 줄을 생성하는 기능을 제공한다.
• The progress element can be used within headings, paragraphs, or anywhere else in the body.
  • progress element는 제목, 토막글, body의 다른 곳에서 사용될 수 있다.

Progress Element Attributes

progress element 속성

• value: Specifies how much of the task has been completed.
  • 완료된 작업의 양을 지정한다.
• max: Specifies how much work the task requires in total.
  • 작업에 필요한 작업량의 합계를 지정한다.

• Example:

Status: <progress min="0" max="100" value="35"></progress>

코드 실행 확인

• Result:

Use the <progress> tag in conjunction with JavaScript to dynamically display a task’s progress.

JavaScript와 함께 <progress> 태그를 사용해서 작업 진행을 동적으로 표시한다.

QUIZ

• Define a progress bar that shows 63 percent of progress:
  • 진행률의 63퍼센트를 보여주는 진행 표시 줄을 정의해라.

<progress
          min="0"
          max="100"
          value="63">
</progress>