Cara Menggabung Cell (Merge) pada HTML

A. Pendahuluan :

Tabel (Table) adalah sebuah data dalam bentuk grid yang terdiri dari kolom (column), baris (row) dan cell yang merupakan pertemuan antara kolom dan baris.

Dalam penggabungan cell pada tabel, kita membutuhkan beberapa perintah tag. Tag pertama yang kita gunakan adalah tag < table > dan diakhiri dengan tag < / table > dengan disisipkan border digunakan untuk memulai sebuah tabel dengan ketebalan garis tepi tabel (dalam pixel). Tag kedua yang kita gunakan adalah tag < tr > dan diakhiri dengan < / tr > dengan disisipkan bgcolor digunakan untuk membuat baris dari tabel dengan warna background table atau cell. Tag ketiga yang kita gunakan adalah tag < td > dan diakhiri dengan < / td > dengan disipkan colspan digunakan untuk menginput data ke tabel dengan jumlah kolom yang akan digabung (merge).


B. Script Code

<!DOCTYPE> <html> <head> <title> Membuat Tabel </title> <h1 style ="text-align:center;"><u> Cara Membuat Tabel pada HTML </u></h1> </head> <body> <H1> Harga Buah </H1> <table border="2" align="center" width="40%"> <tr bgcolor="#b2dfdb"> <td> Baris 1, Kolom 1 </td> <td> Baris 1, Kolom 2 </td> <td> Baris 1, Kolom 3 </td> </tr> <tr> <td> Baris 2, Kolom 1 </td> <td colspan="2"> Baris 2, Kolom 2 dan 3 digabung </td> </tr> <tr> <td> Baris 3, Kolom 1 </td> <td> Baris 3, Kolom 2 </td> <td> Baris 3, Kolom 3 </td> </tr> </table> </body> </html>

C. Hasil Preview

Harga Buah

Baris 1, Kolom 1 Baris 1, Kolom 2 Baris 1, Kolom 3
Baris 2, Kolom 1 Baris 2, Kolom 2 dan 3 digabung
Baris 3, Kolom 1 Baris 3, Kolom 2 Baris 3, Kolom 3

D. Kesimpulan :

Dari Script dan hasil di atas dapat diketahui bahwa terdapat tabel dengan berwarna serta kolomnya tergabung dengan kolom lainnya sesuai dengan yang diinputkan seperti di atas pada baris 2 kolom 2 dan 3 digabung.