cloud-hosting-terbaik-indonesia

Tutorial Form HTML Part 2: Fungsi dan Cara Penggunaan Tag Fieldset dan Tag Legend

Posted on

Setelah mempelajari tag Label di panduan pertama-tama, pada panduan kedua ini kita akan mempelajari fungsi dan penggunaan tag fieldset dan tag legend pada perancangan form HTML.


Guna Tag Fieldset dan Tag Legend pada perancangan Form HTML

Guna tag fieldset dan tag label lebih kepada tampilan form, karena akan mempermudah dan mempercantik form yang dikerjakan.

Tag Fieldset berfungsi bagi mengelompokkan beberapa objek form menjadi sebuah kelompok, sedangkan Tag Legend berfungsi bagi menampilkan judul dari kelompok objek form tersebut.

Berikut yaitu tampilan form HTML yang dikelompokkan menggunakan tag Fieldset dan tag Legend:

Dari gambar diatas dapat dilihat bahwa alternatif dari checkbox yang terdapat dikelompokkan kedalam kelompok “Rencana hari ini”, dan browser akan menampilkannya pada sebuah kotak.


Cara Pemakaian Tag Fieldset dan Tag Legend

Bagi dapat merancang tampilan seperti gambar diatas, kita tinggal menambahkan tag fieldset dan tag legend di awal form. Format mendasar penulisannya yaitu selaku berikut:

tag fieldset dan tag legend mesti digunakan berpasangan, karena keduanya saling berkaitan. Tag fieldset berfungsi bagi menandai hingga dimana kotak fieldset akan dikerjakan, sedangkan tag legend berfungsi bagi memberikan judul dari fieldset tersebut.

Berikut yaitu contoh kode HTML bagi pemakaian tag fieldset dan tag legend:

Hasil tampilan kode diatas akan sama dengan tampilan di awal panduan ini.


Cara merubah rata text tag legend: atribut align

Sekiranya sahabat perhatikan, tag legend secara default berada di sisi kiri form, namun sahabat dapat merubah settingan ini dengan menambahkan atribut align di tag legend.

Nilai dari atribut align ini dapat diantara dari: left, center, right, top dan bottom. Kamu dapat mencoba kelima nilai ini, namun nilai top dan bottom umumnya tak di support oleh web browser.

Karena atribut align ini benar-benar berkaitan dengan CSS, sebaiknya sahabat menggunakan CSS bagi mengatur align dari tag legend.


Tag fieldset dan tag legend yang kita pelajari disini lebih berfungsi bagi tampilan dari form, namun form yang tertata dan terkelompok dengan bagus akan mempermudah user pada menggunakannya.

Di panduan berikutnya kita akan membahas mengenai fungsi dan cara penggunaan tag button di pada form HTML.


Sumber https://www.duniailkom.com/