Salam hangat teman-teman, semoga teman-teman sehat selalu ya, Kali ini saya akan mencoba membagi Cara Memasukan Legend Pada Fieldset di Bootstrap.

Tag Fieldset berfungsi untuk mengelompokkan beberapa objek form menjadi sebuah kelompok, sedangkan Tag Legend berfungsi untuk menampilkan judul dari kelompok objek form tersebut. Secara keseluruhan akan mempermudah user dalam mengisi form dan mempercantik tampilan form.

Sekarang saya akan mencoba membuatnya dengan menggunakan framework bootstrap,karena di bootstrap sudah menyediakan suatu class untuk membuat pop-up tersebut. Berikut tutorial singkat tentang Cara Memasukan Legend Pada Fieldset di Bootstrap:

– Pertama teman-teman download framework bootstrapnya dulu.

– Kedua buka text editor teman-teman lalu buka file bootstrap yang telah kita download dan buat file index.html dengan cara mengcopy default html yang sudah ada di website bootstrap, jangan lupa save di dalam folder bootstrap teman-teman

– Ketiga kita buat fieldset, legend dan formnya. Berikut kode html-nya:

Apabila di jalankan di broswer makan akan tampil seperti ini:

Cara Memasukan Legend Pada Fieldset di Bootstrap-1

– Ke-empat kita buat custom.css nya untuk membuat tag legendnya berada sejajar dengan garis border pada fieldset dan mempercantik tampilannya sedikit. Berikut custom.css nya:

– Hasilnya akan menjadi seperti ini:

Cara Memasukan Legend Pada Fieldset di Bootstrap-2

 

Bagaimana teman-teman cukup mudahkan Memasukan Legend Pada Fieldset di Bootstrap.

Sekian artikel saya hari ini tentang Cara Memasukan Legend Pada Fieldset di Bootstrap Sehat selalu ya teman-teman, selamat mencoba.