Cara Menggabungkan Baris dan Kolom Tabel Pada HTML

Assalamualaikum Wr. Wb.

Selamat datang di ProgramPc pada postingan kali ini saya akan menjelaskan Cara Menggabungkan Baris dan Kolom Tabel Pada HTML.

Terkadang dalam pembuatan sebuah tabel kita membutuhkan tabel dengan jumlah kolom yang berbeda antara baris petama dengan baris lainnya. Untuk keperluan tersebut dalam HTML kita bisa menggunakan attribut rowspan dan colspan.

Attribut rowspan dan colspan berfungsi untuk menggabungkan sel satu dengan sel yang lainnya. Agar lebih mudah memahami langsung saja anda buat contoh file HTMLnya.

Pertama buka aplikasi text editor yang anda miliki (disini saya menggunakan notepad++), lalu buat file baru seperti dibawah ini.

<html>
<head>
<title>Cara Menggabungkan Baris dan Kolom Tabel Pada HTML</title>
</head>
<body>
<table border="1">
    <tr>
        <td rowspan="2">Baris 1 & 2, Kolom 1</td>
        <td colspan="2">Baris 1, Kolom 2 & 3</td>
    </tr>
    <tr>
        <td>Baris 2, Kolom 1</td>
        <td>Baris 2, Kolom 2</td>
    </tr>
    <tr>
        <td> Baris 3, Kolom 1</td>
        <td> Baris 3, Kolom 2</td>
        <td> Baris 3, Kolom 3</td>
    </tr>
    <tr>
        <td> Baris 4, Kolom 1</td>
        <td> Baris 4, Kolom 2</td>
        <td> Baris 4, Kolom 3</td>
    </tr>
</table>
</body>
</html>

Save file tersebut dengan nama tabel1.html, lalu buka dengan menggunkan Mozilla Firefox atau browser yang anda miliki, maka hasilnya akan seperti dibawah ini.

Dari hasil diatas anda bisa menyimpulkan kegunaan masing-masing attribut. Cukup sekian penjelasan dari saya, kurang lebihnya mohon maaf apabila ada kesalahan penulisan.

Wassamualaikum Wr. Wb.

ProgramPC

Cara Menggabungkan Baris dan Kolom Tabel Pada HTML

Unknown

Artikel Terkait