Saturday, September 10, 2016

Pembuatan Tabel dalam Tabel



1. Tabel di dalam Tabel (Tabel bersarang)

Coba perhatikan gambar tabel berikut ini :

Gambar 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 :


       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 (<td></td>).
Berikut ini contoh langkah-demi langkah :
  • Buatlah tabel dengan 2 kolom dan 2 baris. HTML tag-nya adalah sebagai berikut :

  • Tentukan sel dimana kita ingin menempatkan tabel bersarang. Kita akan menaruh di kolom 2 baris 2.
  • Ganti teks dalam sel itu dengan tabel kedua. HTML akan terlihat seperti ini


Hasilnya adalah sebagai berikut :



Trik untuk tabel bersarang adalah untuk selalu menutup tag tabel dalam sebelum menutup sel tabel luar.
            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 (<td></td>).

Contoh HTML tabel dalam tabel seperti gambar berikut ini:

Hasilnya seperti ini



No comments:

Post a Comment