Cara Membuat Skala Dengan Menggunakan HTML 5

HTML adalah singkatan dari Hypertext Markup Language yaitu sebuah bahasa pemrograman standar yang digunakan bagi membangun halam sebuah blog, sehingga halaman tersebut dapat diakases oleh user dengan menggunakan internet. Di html terdapat banyak tag-tag yang dapat menolong kita pada perancangan sebuah blog di panduan kali ini kita akan membahas mengenai Cara Merancang Skala Dengan Menggunakan HTML 5 bagi membangun skala dengan menggunakan HTML ada kita dapat menggunakan tag <progress></progress> dan <meter></meter>.



Skala ini sering kita jumpai di webite-webite seperti, kita akan mengupload sebuah file karenanya akan munculul berapa presen proses yang telah berhasil di upload, dan skala tersebut pun sering kita temui di dikala kita memasukan password karenanya akan muncul range atau skala password yang kita masukan yaitu strong, medium, ataupun low.



Bagi pengecekan password yang kita bikin apakah strong, medium, ataupun low, teman-teman dapat lihat di  http://www.passwordmeter.com/.



biar teman-teman lebih paham mengenai Cara Merancang Skala Dengan Menggunakan HTML 5 kita akan membangun sebuah contoh sederhana seperti dibawah ini :



<!DOCTYPE html>
<html>
<head>
<title>skala</title>
</head>
<body>
<progress value=56 max=100></progress>

</body>
</html>


Ket :



Di script diatas dapat kita lihat bahwa kita memasukan value 56 (pada hitungan persen), dengan nilai maksimalnya yaitu 100% jikalau kita jalankan di browser karenanya akan terlihat hasilnya seperti dibawah ini :





Berikutnya kita akan membangun skala dengan menggunakan tag meter bagi scriptnya seperti dibawah ini :



<!DOCTYPE html>
<html>
<head>
<title>skala</title>
</head>
<body>

<progress value=56 max=100></progress>

<!-- skala dengan menggunakan min max -->
<meter value=6 min=0 max=10></meter> Nilai min 0 dan max 10<br><br>


<!-- skala high dan low -->
<meter low=60 high=80 max=100 value=100></meter>A <br>
<meter low=60 high=80 max=100 value=84></meter>B <br>
<meter low=60 high=80 max=100 value=70></meter>C <br>
<meter low=60 high=80 max=100 value=50></meter>D

</body>
</html>


Ket :



Di script diatas dapat kita lihat bahwa terdapat dua perbedaan di contoh yang pertama-tama kita memasukan skala dengan menggunakan nilai minimal dan nilai maksimal, sedangkan di contoh yang kedua kita dapat menentukan high dan low dari skala yang kita bikin, jikalau kita jalankan di browser karenanya akan terlihat hasilnya seperti dibawah ini :





Oke teman-teman begitulah pembahasan kita di panduan kali ini mengenai Cara Merancang Skala Dengan Menggunakan HTML 5.



Semoga bermanfaat.



Terima kasih.




Sumber https://kursuswebsite.org

Popular posts from this blog

Perbedaan Antara Keyup dan Keydown Pada jQuery

Membuat Table Warna Berselang dengan PHP