Mempelajari Fungsi Colspan dan Rowspan pada Tabel

29/06/2020    Risman Hakim    134     Website

Mempelajari Fungsi Colspan dan Rowspan pada Tabel - Jika kalian mempelajari HTML tentu kalian akan menemukan table yang merupakan bagian dari dokumen HTML dimana dahulu ketika layout halaman sebelum adanya CSS table digunakan untuk mengatur tata letak. Kemudian ada bagian yang sering sekali berhubungan dengan tabel yakni atribut colspan dan rowspan, apa kalian tahu fungsi kedua atribut tersebut ? Nah, bagi kalian yang ingin tau lebih dari masing - masing atribut colspan dan rowspan, berikut akan saya jelaskan Fungsi Colspan dan Rowspan pada Tabel.

Colspan atau column span merupakan atribute HTML yang berfungsi untuk menggabungkan beberapa kolom, sederhananya menggabungkan kolom ke samping.
Rowspan merupakan atribut HTML yang fungsi utamanya adalah menggabungkan beberapa baris, sederhananya menggabungkan baris ke bawah.

Agar lebih jelas dalam Mempelajari Fungsi Colspan dan Rowspan pada Tabel akan saya praktekan bagaimana penggunaan dari kedua atribut tersebut.

Kalian bisa buat satu file HTML kemudian kalian ketikan sintak HTML untuk membuat table dan beberapa kolom seperti berikut.

<body>
    <table>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
        </tr>
        <tr>
            <td colspan="2">5</td>
            <td>6</td>
            <td rowspan="3">7</td>
        </tr>
        <tr>
            <td>8</td>
            <td>9</td>
            <td>10</td>
        </tr>
        <tr>
            <td>11</td>
            <td>12</td>
            <td>13</td>
        </tr>
    </table>
</body>

Dari sintak diatas ada penggunaan atribut yang bisa kalian lihat pada kolom no 5 adalah atribut colspan dimana nilai atribut colspan adalah dua yang artinya menggabungkan sebanyak 2 kolom ke samping. kemudian pada kolom 7 penggunaan atribut rowspan dengan nilai rowspan 3 yang artinya menggabungkan sebanyak 3 baris kebawah.

Penggunaan kedua atribut tersebut sangatlah mudah, tinggal dilihat kolom dan baris saja yang ingin digabungkan, apakah ke samping atau kebawah.

Semoga dengan pembahasan dan tutorial diatas bisa membuat kalian lebih faham lagi dengan fungsi dan penggunaan atribut colspan dan rowspan. Cukup sekian artikel dumetschool kali ini semoga bermanfaat dan tetap semangat belajar

No data.

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More

Cara Cepat Pintar Membuat Website, Tanpa Perlu Basic IT

Membuat website perusahaan, portal berita, blog, katalog online, dan e-commerce.

Learn More