Wednesday, November 19, 2014

Tag meter HTML

Tag <meter> HTML5 digunakan untuk mewakili nilai skala, baik bilangan bulat atau pecahan. Nilai skala ini mempunyai batas maksimum - tetapi nilai sebenarnya bisa hanya sepertiga, setengah atau nilai lainnya. Misalnya, hardisk Anda kapasitasnya 100 Gb (Gigabyte) tetapi hanya terisi 10 Gb. Untuk menggambarkan 10 Gb dalam 100 Gb bisa dibuat dengan tag meter.

Tampilan tag meter berupa persegi panjang berukuran kecil, warna abu-abu sebagai kapasitas maksimum dan warna hijau berarti nilai yang sebenarnya.

Contoh: meter.html

<!DOCTYPE HTML>
    <html>
        <head>
            <title>Tag meter html</title>
        </head>
    <body>
        <p>Kapasitas hardisk Anda (100 Gb) setelah terisi: <meter max="100" value="10">10 Gb</meter></p>
    </body>
</html>

Output:
Tampilan tag meter di Mozilla Firefox.
Atribut-atribut tag meter:
value= nilai meter sebenarnya.
min= nilai minimal (jika dibutuhkan).
max= nilai maksimal meter.

Contoh 2: meter2.html

<!DOCTYPE HTML>
    <html>
        <head>
            <title>Tag meter html</title>
        </head>
    <body>
        <p>Daya baterai ponsel Anda telah kritis: <meter min="4" max="100" value="8"></meter> segera lakukan isi ulang.</p>
    </body>
</html>


Output:

^Baca juga: Tag noscript HTML.

Referensi tulisan:
  1. <meter>; ditulis oleh: Kontributor MDN, developer.mozilla.org, diakses 19 Nopember 2014.
    About MDN by Mozilla Contributors is licensed under CC-BY-SA 2.5.
  2. The HTML5 meter Element; ditulis oleh: Guest Author, css-tricks.com, diakses 19 Nopember 2014.

No comments:

Post a Comment