Cara Membuat Tabel dengan HTML: Panduan Lengkap

Pendahuluan

Dalam pembuatan website, tabel adalah salah satu elemen utama yang sering digunakan untuk menyusun data agar lebih mudah dibaca dan dimengerti. Elemen tabel dalam HTML memungkinkan kita untuk menampilkan information dalam baris dan kolom yang terstruktur. Dengan tabel, data seperti jadwal, harga, statistik, serta informasi lain dapat disajikan dengan lebih rapi. Artikel ini akan menjelaskan bagaimana membuat tabel dengan HTML, mulai dari tahap dasar hingga fitur-fitur lanjutan seperti menambahkan atribut dan mengatur gaya.

Penjelasan Tabel HTML

• Struktur Dasar Table

Untuk membuat tabel dalam HTML, kita gunakan tag <table> . Di tabel, terdapat tiga elemen utama yang sering digunakan:

• <thead> Baris judul atau header tabel.
• <tbody> Baris data utama dalam tabel.
• <tfoot> Biasanya berisi baris informasi tambahan di bagian bawah tabel, seperti total atau catatan lain.

• Tabel diatur dalam baris (<tr>) dan kolom yang diwakili oleh  (<th>) untuk judul kolom atau  (<td>) untuk sel data.

Panduan Lengkap Cara Membuat Tabel dengan HTML

• Membuat Tabel Sederhana

Dibawah ini adalah contoh tabel sederhana yang menampilkan daftar barang beserta harga dan jumlah stok.

• Menambahkan Atribut pada Tabel

Beberapa atribut yang biasa digunakan pada tabel HTML adalah:

• border : Menentukan lebar garis tabel.
• cellpadding dan cellspasing : Mengatur jarak cell tabel.
• width dan height : Mengatur besar tabel.

Contoh tabel dengan tambahan attribut :

• Menggabungkan Kolom dan Baris

Kadang-kadang kita perlu menggabungkan beberapa sel menjadi satu agar tampilan data terlihat lebih rapi. HTML memiliki atribut colspan untuk menggabungkan kolom dan rowspan untuk menggabungkan baris. 

Contoh tabel dengan penggabungan kolom dan baris:

• Menambahkan Style pada Tabel

Css dapat memperindah tampilan tabel agar lebih menarik dan mudah dibaca. Dibawah ini adalah contoh penambahan Style sederhana pada tabel:

Kesimpulan

Tabel adalah bagian dari HTML yang berguna untuk menyusun data dengan teratur dan mudah dipahami. Dalam artikel ini, kita sudah membicarakan cara dasar membuat tabel menggunakan HTML. Ini termasuk menambahkan atribut, menggabungkan sel, dan memberikan gaya pada tabel. Dengan pemahaman ini, kita bisa menampilkan data dengan lebih profesional dan mudah dibaca di halaman web.