Tutorial Belajar HTML Part 11 - Membangun Tabel (Table) dalam HTML: Mengatur Data dalam Bentuk Tabel

• 10/15/2023
• Robby Birham
• 35

Membangun Tabel (Table) dalam HTML: Mengatur Data dalam Bentuk Tabel

Pembuatan tabel dalam HTML adalah cara yang efektif untuk mengatur dan menampilkan data dalam bentuk terstruktur. Dengan tag <table>, Anda dapat membuat kolom dan baris untuk mengatur informasi ke dalam format tabel yang mudah dibaca.

Tag Dasar untuk Membangun Tabel

Tag <table>

Tag <table> adalah tag utama yang digunakan untuk membungkus seluruh tabel.

Tag <tr>

Tag <tr> (table row) digunakan untuk menentukan baris dalam tabel.

Tag <th> dan <td>

• Tag <th> (table header) digunakan untuk membuat sel header atau kolom.

• Tag <td> (table data) digunakan untuk membuat sel data dalam tabel.

Struktur Dasar Tabel

Contoh Tabel Sederhana:

<table>
    <tr>
        <th>Nama</th>
        <th>Usia</th>
    </tr>
    <tr>
        <td>John</td>
        <td>25</td>
    </tr>
    <tr>
        <td>Jane</td>
        <td>30</td>
    </tr>
</table>

Elemen Tambahan dalam Tag Tabel

Tag <caption>

Tag <caption> dapat digunakan untuk memberikan judul atau deskripsi singkat untuk tabel.

Atribut untuk Pengaturan Tabel

• border: Menentukan tebal garis batas tabel.

• width dan height: Mengatur lebar dan tinggi tabel.

• cellpadding dan cellspacing: Menentukan jarak antara isi sel dan ruang antar sel.

Menggabungkan Sel dan Baris

Anda dapat menggabungkan sel atau baris dalam tabel menggunakan atribut colspan dan rowspan untuk membuat tata letak yang lebih kompleks.

Kesimpulan

Pembuatan tabel dalam HTML memungkinkan Anda untuk menampilkan data secara terstruktur dan terorganisir. Dengan tag-tag yang disediakan, Anda dapat membuat tabel yang mudah dibaca dan dimengerti. Pastikan untuk menggunakan tag tabel secara tepat, memberikan deskripsi atau judul yang sesuai, serta memperhatikan penggunaan atribut untuk memperbaiki tampilan dan kejelasan tabel.