"HTML meter 태그"의 두 판 사이의 차이

 
(사용자 2명의 중간 판 22개는 보이지 않습니다)
1번째 줄: 1번째 줄:
{{테스트|Chrome 39.0}}
==개요==
==개요==
;HTML <meter> Tag
;HTML <meter> Tag
;HTML meter 태그
;HTML meter 태그
*min 기본값은 0, max 기본값은 1


<source lang='html5'>
==예시 1==
<meter value="3" min="1" max="6">3 / 6</meter><br>
<syntaxhighlight lang='html'>
<meter value="0.75">75%</meter>
<meter value="0.75">75%</meter><br>
</source>
<meter min="1" max="6" value="3">3 / 6</meter>
*예제: http://jmnote.com/html5/meter.php
</syntaxhighlight>
<jsfiddle>ynmcogma</jsfiddle>
 
==예시 2: low, high==
<syntaxhighlight lang='html'>
<br><meter low="0.25" high="0.75" value="-0.1"></meter> -10%
<br><meter low="0.25" high="0.75" value="0.0"></meter> 0%
<br><meter low="0.25" high="0.75" value="0.1"></meter> 10%
<br><meter low="0.25" high="0.75" value="0.2"></meter> 20%
<br><meter low="0.25" high="0.75" value="0.3"></meter> 30%
<br><meter low="0.25" high="0.75" value="0.4"></meter> 40%
<br><meter low="0.25" high="0.75" value="0.5"></meter> 50%
<br><meter low="0.25" high="0.75" value="0.6"></meter> 60%
<br><meter low="0.25" high="0.75" value="0.7"></meter> 70%
<br><meter low="0.25" high="0.75" value="0.8"></meter> 80%
<br><meter low="0.25" high="0.75" value="0.9"></meter> 90%
<br><meter low="0.25" high="0.75" value="1.0"></meter> 100%
<br><meter low="0.25" high="0.75" value="1.1"></meter> 110%
</syntaxhighlight>
<jsfiddle height='300'>ygs4ho1w</jsfiddle>
 
==예시 3: low, high, optimum==
<syntaxhighlight lang='html'>
<br><meter optimum="0" low="0.65" high="0.85" value="0.0"></meter> 0%
<br><meter optimum="0" low="0.65" high="0.85" value="0.1"></meter> 10%
<br><meter optimum="0" low="0.65" high="0.85" value="0.2"></meter> 20%
<br><meter optimum="0" low="0.65" high="0.85" value="0.3"></meter> 30%
<br><meter optimum="0" low="0.65" high="0.85" value="0.4"></meter> 40%
<br><meter optimum="0" low="0.65" high="0.85" value="0.5"></meter> 50%
<br><meter optimum="0" low="0.65" high="0.85" value="0.6"></meter> 60%
<br><meter optimum="0" low="0.65" high="0.85" value="0.7"></meter> 70%
<br><meter optimum="0" low="0.65" high="0.85" value="0.8"></meter> 80%
<br><meter optimum="0" low="0.65" high="0.85" value="0.9"></meter> 90%
<br><meter optimum="0" low="0.65" high="0.85" value="1.0"></meter> 100%
</syntaxhighlight>
<jsfiddle height='300'>7p0a8u1z</jsfiddle>


==같이 보기==
==같이 보기==
*[[HTML progress 태그]]
*[[HTML progress 태그]]
*[[HTML5 새 요소]]
*[[jQuery UI 프로그레스바]]
*[[HTML5 새 태그]]
*[[프로그레스바]]


==참고 자료==
==참고==
*http://www.w3schools.com/tags/tag_meter.asp
*http://www.w3schools.com/tags/tag_meter.asp


[[분류: HTML5]]
[[분류: HTML5]]
[[분류: HTML 태그]]
[[분류: HTML 태그]]

2021년 3월 4일 (목) 14:43 기준 최신판

1 개요[ | ]

HTML <meter> Tag
HTML meter 태그
  • min 기본값은 0, max 기본값은 1

2 예시 1[ | ]

<meter value="0.75">75%</meter><br>
<meter min="1" max="6" value="3">3 / 6</meter>

3 예시 2: low, high[ | ]

<br><meter low="0.25" high="0.75" value="-0.1"></meter> -10%
<br><meter low="0.25" high="0.75" value="0.0"></meter> 0%
<br><meter low="0.25" high="0.75" value="0.1"></meter> 10%
<br><meter low="0.25" high="0.75" value="0.2"></meter> 20%
<br><meter low="0.25" high="0.75" value="0.3"></meter> 30%
<br><meter low="0.25" high="0.75" value="0.4"></meter> 40%
<br><meter low="0.25" high="0.75" value="0.5"></meter> 50%
<br><meter low="0.25" high="0.75" value="0.6"></meter> 60%
<br><meter low="0.25" high="0.75" value="0.7"></meter> 70%
<br><meter low="0.25" high="0.75" value="0.8"></meter> 80%
<br><meter low="0.25" high="0.75" value="0.9"></meter> 90%
<br><meter low="0.25" high="0.75" value="1.0"></meter> 100%
<br><meter low="0.25" high="0.75" value="1.1"></meter> 110%

4 예시 3: low, high, optimum[ | ]

<br><meter optimum="0" low="0.65" high="0.85" value="0.0"></meter> 0%
<br><meter optimum="0" low="0.65" high="0.85" value="0.1"></meter> 10%
<br><meter optimum="0" low="0.65" high="0.85" value="0.2"></meter> 20%
<br><meter optimum="0" low="0.65" high="0.85" value="0.3"></meter> 30%
<br><meter optimum="0" low="0.65" high="0.85" value="0.4"></meter> 40%
<br><meter optimum="0" low="0.65" high="0.85" value="0.5"></meter> 50%
<br><meter optimum="0" low="0.65" high="0.85" value="0.6"></meter> 60%
<br><meter optimum="0" low="0.65" high="0.85" value="0.7"></meter> 70%
<br><meter optimum="0" low="0.65" high="0.85" value="0.8"></meter> 80%
<br><meter optimum="0" low="0.65" high="0.85" value="0.9"></meter> 90%
<br><meter optimum="0" low="0.65" high="0.85" value="1.0"></meter> 100%

5 같이 보기[ | ]

6 참고[ | ]

문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}