PEMROGRAMAN WEB SEMESTER 1
94 | P a g e
9. Kegiatan Belajar 9 : Pembuatan Tabel dalam Tabel
a. Tujuan Pembelajaran
Setelah mengikuti kegiatan belajar 9 ini Peserta Didik diharapkan dapat : 1. Memahami tabel di dalam tabel
2. Menyajikan tabel dalam tabel
b. Uraian Materi 1. Tabel di dalam Tabel Tabel bersarang
Coba perhatikan gambar tabel berikut ini
:
Gambar 9.1. Tabel Online Order
Dapat kita lihat bahwa di kolom “Email account note” ada table berisi tentang catatan jenis email. Jadi ada tabel di dalam tabel atau istilahnya “nested table”
atau
tabel bersarang.
Dalam penulisan HTML “tabel bersarang” ini adalah dengan menuliskan HTML Tabel di dalam sebuah sel dari tabel, letaknya adalah pada
td….td, seperti berikut ini : table
tr tddata baris 1 kolom 1td
td table
tr tdtabel ke 2td
tdtabel ke 2td
Pemrograman Web Semester 1
95 | P a g e
tr tabletd
tr
table
Teknik tabel bersarang adalah salah satu cara untuk menghasilkan layout tabel yang kompleks tanpa membuat tabel yang sangat kompleks. Sehingga
ketika harus membuat tabel yang kompleks, maka cara sederhananya adalah membuat tabel di dalam sebuah sel tdtd.
Berikut ini contoh langkah-demi langkah : x Buatlah tabel dengan 2 kolom dan 2 baris. HTML tag-nya adalah sebagai
berikut : table border=1
tr tdkolom 1 baris 1td
tdkolom 2 baris 1td tr
tr tdkolom 1 baris 2td
tdkolom 2 baris 2td tr
table x Tentukan sel dimana kita ingin menempatkan tabel bersarang. Kita akan
menaruh di kolom 2 baris 2. x Ganti teks dalam sel itu dengan tabel kedua. HTML akan terlihat seperti
ini
table border=1 tr
tdkolom 1 baris 1td tdkolom 2 baris 1td
tr tr
PEMROGRAMAN WEB SEMESTER 1
96 | P a g e
tdkolom 1 baris 2td td
table border=1 tr
tdkolom 1 baris 1td tdkolom 2 baris 1td
tr tr
tdkolom 1 baris 2td tdkolom 2 baris 2td
tr table
td tr
table
Hasilnya adalah sebagai berikut :
Trik untuk tabel bersarang adalah untuk selalu menutup tag tabel dalam sebelum menutup sel tabel luar.
c. Rangkuman
Teknik tabel bersarang adalah salah satu cara untuk menghasilkan layout tabel yang kompleks tanpa membuat tabel yang sangat kompleks. Sehingga
ketika harus membuat tabel yang kompleks, maka cara sederhananya adalah membuat tabel di dalam sebuah sel tdtd.
d. Tugas