Referensi Belajar HTML meter tag. Tutorial dan panduan mengenai element <meter>...</meter> yang digunakan untuk mengukur (memeteri) data. Mencakup pembahasan lebih detail dan lengkap yang disertai contoh kode penggunaan sebagai rujukan untuk materi belajar HTML elemen <meter>.


Deskripsi
Penjelasan HTML meter tag

HTML <meter> element digunakan untuk mengukur data berdasarkan tingkat tertentu. Memeteri data dengan bilangan yang menunjukkan tingkat meteran atau dikenal dengan istilah gauge.

Contohnya, digunakan untuk menunjukkan kapasitas hardisk / memory disk dan hasil pencarian (query result).

<meter> tag tidak boleh digunakan apabila menunjukkan sebuah progres (berlangsungnya sebuah kegiatan). Untuk hal ini, gunakan <progress> element.

Attributes
Atribut HTML Tag <meter>

form

Menentukkan satu atau dua lebih form yang mana <meter> element tersebut diperuntukkan baginya.

height

Menentukkan tingkat nilai yang dianggap tinggi.

low

Menentukkan tingkat nilai yang dianggap rendah.

max

Menentukkan tingkat nilai maksimum.

min

Menentukkan tingkat nilai minimum.

optimum

Menentukkan berapa jumlah optimal yang berlaku untuk meteran tersebut.

value

Menentukkan nilai saat ini yang berlaku. Attribute ini wajib ditulis.


Global Attributes
Atribut Secara Global (Keseluruhan)

<meter> tag mencakup global attributes.

Event Attributes
Atribut event (Peristiwa)

<meter> tag mencakup event attributes.

Attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Example
Contoh HTML <meter> element

Contoh kode

HTML
<p>Contoh nilai 4 dari 10</p>
<meter value="4" min="0" max="10">4 dari 10</meter><br>
<br>
<p>Contoh 50%</p>
<meter value="0.5">50%</meter>

Contoh Lengkap

Contoh source code lengkap disertai dengan link "editor" untuk mencoba (try it) dan melihat hasil (preview) kode.

SOURCE
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Demo HTML meter tag</title>
    <style>

    </style>
  </head>
    <body>
    <p>Contoh nilai 4 dari 10</p>
    <meter value="4" min="0" max="10">4 dari 10</meter><br>
    <br>
    <p>Contoh 50%</p>
    <meter value="0.5">50%</meter>
  </body>
</html>