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

 

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 Barisan

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.