2.6 Belajar HTML [ Membuat Tabel ]

Membuat Tabel di HTML

Tabel terdiri dari 4 unsur utama, yaitu :

1. Baris
2. Kolom
3. Sel
4. Garis

sumber : Petani Kode

Tag untuk Membuat Tabel di HTML

1. Tag <table> untuk membungkus tabelnya
2. Tag <thead> untuk membungkus bagian kepala tabel
3. Tag <tbody> untuk membungkus bagian body dari tabel
4. Tag <tr> (table row) untuk membuat baris
5. Tag <td> (table data) untuk membuat sel
6. Tag <th> (table head) untuk membuat judul pada header

Contoh :

Hasilnya...

Kemudian, untuk menambahkan garis yaitu dengan menambahkan atribut <border="1"> di dalam tag table. Contoh :

Hasilnya...

Mengatur Jarak Sel dengan Cellpading

Atribut "cellpadding" digunakan untuk jarak teks pada tabel dengan garis di dalam sel. Atribut ini dapat kita berikan pada tag <table>. Contoh :

Hasilnya...

Menambahkan Warna pada Sel dan Baris

Untuk menambahkan warna pada sel dan baris, kita bisa menambahkan atribut <bgcolor> di dalam tag <td> untuk sel atau <tr> untuk baris. 

Contoh :

Hasilnya...

Menggabungkan Sel Tabel

Atribut yang digunakan untuk menggabungkan tabel adalah <rowspan> dan <colspan>. 

• <rowspan> digunakan untuk menggabungkan baris
• <colspan> digunakan untuk menggabungkan kolom

Atribut ini digunakan di dalam tag <th> dan <td>

sumber : Petani Kode

Contoh :

Hasilnya...

Menyisipkan Elemen Lain ke dalam Tabel

Di dalam sel <td> dan <th>, kita menyisipkan elemen HTML yang lain, seperti gambar, link, video, list, dsb.

Contoh :

Hasilnya...

~ Terima Kasih ~