<meter>
HTML <meter> 요소는 특정 범위 내에서의 스칼라 값, 또는 백분율 값을 나타냅니다.
시도해보기
The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
특성
이 요소는 전역 특성을 포함합니다.
value-
현재의 값. 최소와 최댓값(
min과max특성)을 지정한 경우, 그 사이여야 합니다. 지정하지 않았거나 잘못된 값인 경우0으로 간주합니다. 지정했으나 범위 바깥인 경우, 범위에 맞춰 나머지 값을 버립니다.참고:
value가0이상1이하가 아닌 이상,min과max를 정의해value값이 그 안에 들어가도록 해야 합니다. min-
측정 범위의 가능한 최솟값. 지정할 경우 최댓값(
max특성) 미만이어야 합니다. 지정하지 않은 경우0입니다. max-
측정 범위의 가능한 최댓값. 지정할 경우 최솟값(
min특성)을 초과해야 합니다. 지정하지 않은 경우1입니다. low-
측정 범위 중 낮은 범위의 최댓값. 지정할 경우 전체 범위 최솟값(
min특성)을 초과해야 하며, 높은 범위 최댓값과 전체 범위 최댓값(각각high와max특성) 미만이어야 합니다. 지정하지 않았거나 전체 범위 최솟값 미만인 경우, 전체 범위 최솟값과 같아집니다. high-
측정 범위 중 높은 범위의 최솟값. 지정할 경우 전체 범위 최댓값(
max특성) 미만이어야 하며, 낮은 범위의 최댓값과 전체 범위 최솟값(각각low와min특성)을 초과해야 합니다. 지정하지 않았거나 전체 범위 최댓값을 초과할 경우 전체 범위 최댓값과 같아집니다. optimum-
이상적인 값.
min과max특성으로 정의한 범위 내에 위치해야 합니다.low와high특성을 함께 사용한 경우,optimum은 어느 범위가 이상적인지 나타냅니다. 예를 들어, 값이min과low사이에 위치한 경우, 측정 범위 중 낮은 범위가 이상적인 범위입니다. form-
<meter>와 연결할<form>요소("양식 소유자"). 같은 문서에 존재하는<form>요소의id특성 값을 사용해야 합니다.form특성을 지정하지 않았으나 조상 중<form>요소가 존재하면 해당<form>과 연결됩니다.<input type="number">(en-US)의 값 범위를 보여주는 등<meter>를 양식 관련 콘텐츠로서 사용할 때만 지정하세요.
예제
간단한 예제
HTML
html
<p>Heat the oven to <meter min="200" max="500"
value="350">350 degrees</meter>.</p>
결과
Google Chrome에서는 다음 그림처럼 보입니다.
높은 범위와 낮은 범위
min 특성의 기본값이 0이므로 생략한 것을 참고하세요.
HTML
html
<p>He got a <meter low="69" high="80" max="100"
value="84">B</meter> on the exam.</p>
결과
Google Chrome에서는 다음 그림처럼 보입니다.
명세
| Specification |
|---|
| HTML Standard # the-meter-element |
브라우저 호환성
BCD tables only load in the browser