Penggunaan Tag Label Dalam Pembuatan Form HTML
Taglabel dipakai sebagai perhiasan keterangan untk bbrapa objek form menyerupai radio dan checkbox. Selain itu tag label juga dipakai untk memudahkan pengguna atau pengunjung untk memasukkan data.Untuk memahami penggunaan tag
label dalam pembuatan form, silahkan ketikan aba-aba dibawah ini :<!DOCTYPE html> <html> <head> <title>Belajar HTML</title> </head> <body> <h2>Apakah hobi Anda ?</h2> <form action="hobi.php" method="post"> <input type="checkbox" name="berenang" id="berenang"/>Berenang<br/> <input type="checkbox" name="menulis" id="menulis"/>Menulis<br/> <input type="checkbox" name="membaca" id="membaca"/>Membaca </form> </body> </html>
Pada pola aba-aba form HTML diatas, Saya menciptakan 3 buah checkbox. Jika Anda ingin menentukan salah satu dari 3 checkbox tersebut, maka Anda harus mencentang kotak pada checkbox tersebut. Namun kotak checkbox tersebut terlalu kecil dan menciptakan agak sulit untk di centang.
Salah satu tips untk mengatasinya adalah menciptakan pengguna atau pengunjung sanggup meng-klik goresan pena atau keterangan dari checkbox tersebut. Untuk melsayakan hal menyerupai ini kita sanggup memakai tag
labelPenulisan Tag Label Dalam Pembuatan Form HTML
Terdapat 3 tips untk menuliskan taglabel dalam pembuatan form, adalah : 1. Memasukkan seluruh tag input ke dalam tag label
Silahkan ketikan aba-aba HTML dibawah ini, kemudian jalankan dibroser :<label> <input type="checkbox" name="berenang" id="berenang"/>Berenang </label>Dengan memasukkan seluruh bab dari dari tag
input termasuk atribut type="checkbox" ke dalam tag label, maka kita sanggup meng-klik goresan pena atau keterangan dari checkbox dan setips otomatis kotak checkbox akan tercentang. 2. Menggunakan atribut for didalam tag label
Dengan memakai atribut for didalam tag label, maka kita tidak harus memasukkan tag input ke dalam tag label.Silahkan ketikan aba-aba HTML dibawah ini, kemudian jalankan dibroser :
<input type="checkbox" name="berenang" id="berenang"/> <label for="berenang">Berenang</label>Perhatikan bahwa tag
label diletakkan sesudah tag input ini agar kotak untk mencentang tidak berada di belakang goresan pena atau keterangan. Di dalam tag label terdapat atribut for yang nilainya harus sama dengan atribut id yang berada di dalam tag input. Dalam pola aba-aba HTML diatas, Saya mengisi nilai dari atribut for="berenang" dan aku juga harus mengisi nilai dari atribut id="berenang". 3. Memasukkan seluruh tag input ke dalam tag label dan memakai atribut for di dalam tag label
Silahkan ketikan aba-aba HTML dibawah ini, kemudian jalankan dibroser :<label for="berenang"> <input type="checkbox" name="berenang" id="berenang"/>Berenang </label>Dalam pola aba-aba HTML diatas Saya menggabungkan 2 tips yaitu memasukkan seluruh tag
input ke dalam tag label dan memakai atribut for di dalam tag label.Berikut ini pola aba-aba form HTML yang sebelumnya kita buat tadi dengan penambahan tag
label beserta atributnya :<!DOCTYPE html> <html> <head> <title>Belajar HTML</title> </head> <body> <h2>Apakah hobi Anda ?</h2> <form action="hobi.php" method="post"> <label> <input type="checkbox" name="berenang" id="berenang"/>Berenang<br/> </label> <input type="checkbox" name="menulis" id="menulis"/> <label for="menulis">Menulis</label><br/> <label for="membaca"> <input type="checkbox" name="membaca" id="membaca"/>Membaca </label> </form> </body> </html>
Silahkan jalankan aba-aba HTML tersebut di broser, kemudian klik goresan pena atau keterangan dari checkbox, maka kotak checkbox akan eksklusif tercentang setips otomatis.
Jika Anda ingin memakai tag
label pada bbrapa objek form HTML, maka disarankan memakai tips kedua adalah memakai atribut for di dalam tag label. Menurut Saya dengan tips ini pembuatan form akan terlihat rapih dan gampang untk dipahami.Pada article selanjutnya, kita akan membahas Penggunaan dan Penulisan Tag Fieldset dan Tag Legend untk mengelompokkan objek form HTML. Sumber https://mas-abdi.blogspot.com/
No comments:
Post a Comment