cloud-hosting-terbaik-indonesia

Tutorial Tabel HTML Part 2: Cara Menggabungkan Sel Tabel (atribut rowspan dan colspan)

Posted on

Bagi tampilan tabel, kadang kita butuh merancang tabel dengan jumlah kolom yang berbeda antara baris pertama-tama dan baris lainnya, atau menggabungkan sebuah sel tabel dengan sel lainnya. Bagi kebutuhan ini, HTML menyediakan atribut rowspan dan colspan. Pada tutorial cara menggabungkan sel Tabel HTML ini, kita akan mempelajari cara penggunaannya.


Manfaat Atribut Rowspan and Colspan

Atribut rowspan and colspan digunakan bagi merancang sel tabel ‘bersatu’ dengan sel yang lain. Atribut ini diletakkan di tag td dari sebuah tabel. Agar gampang memahami, seketika saja kita bikin contoh kode HTMLnya.

Buka program text editor, ketikkan kode berikut, dan save selaku tabelspan.html

Contoh pemakaian atribut rowspan and colspan:

Pada contoh diatas, kita dapat melihat bahwa tag td yang mempunyai atribut colspan, akan merancang sel tabel bersatu dengan kolom disebelahnya. Sedangkan atribut rowspan akan merancang sel tabel bersatu dengan baris dibawahnya. Kedua atribut ini membutuhkan nilai (value), dimana nilai ini yaitu seberapa banyak sel tabel yang dibangun ‘bersatu’.

Misalkan colspan=’3’ akan merancang 3 kolom bergabung menjadi 1 sel, dan rowspan=’2’ akan merancang sel tabel bersatu dengan 1 baris dibawahnya.

Pada merancang tabel dengan atribut rowspan dan clospan, sahabat sebaiknya telah mengkalkulasi seberapa besar tabel yang akan dibangun, karena dengan semakin kompleks tabel, akan semakin rumit bagi menggabungkan beberapa sel tabel tersebut.

Bagi panduan penyusunan tabel HTML berikutnya, kita akan membahas mengenai tag th yang digunakan bagi merancang kolom header, atau judul kolom di pada tabel HTML di pada Tutorial Tabel HTML: Cara Membuat Kolom Header Untuk Tabel (tag th).


Sumber https://www.duniailkom.com/