Belajar Tabel HTML: Spanning

Dalam tutorial belajar tabel HTML kali ini kita akan membahas tentang spanning atau menggabungkan baris/kolom.
Spanning tabel HTML artinya adalah menyatukan atau menggabungkan beberapa kolom atau baris dalam sebuah tabel. Untuk melakukan spanning, kita memerlukan parameter rowspan dan colspan.
Berikut ini contoh kodenya.

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

<table border="1">   <tr>   <th>Judul Kolom 1</th>   <th>Judul Kolom 2</th>   <th>Judul Kolom 3</th>   </tr>   <tr><td rowspan="2">Baris 1 Kolom 1</td>   <td>Baris 1 Kolom 2</td><td>Baris 1 Kolom 3</td></tr>   <tr><td>Baris 2 Kolom 2</td><td>Baris 2 Kolom 3</td></tr>   <tr><td colspan="3">Baris 3 Kolom 1</td></tr>   </table>

Dalam contoh kode di atas, kita juga melihat ada sebuah tag tabel HTML baru yaitu <th>. Tag <th> ini gunanya adalah untuk membuat judul kolom. Biasanya judul kolom ini akan dibuat dengan tulisan yang tebal.

Try This: 4 Langkah Mudah Belajar Cara Membuat Website, Langsung Praktek! KLIK DI SINI!.

Parameter untuk spanning kita letakkan dalam tag <td>. Untuk menyatukan 2 baris dalam sebuah tabel HTML, kita menggunakan parameter rowspan. Sedangkan untuk menyatukan 2 kolom dalam sebuah tabel HTML, kita menggunakan colspan.
Silakan dicoba kode di atas untuk melihat efeknya

Posted in: