Page 2 - E-Modul Pemrograman Web Materi Format Tabel

Modul

Pemrograman Web dan Perangkat Bergerak

( 3.3 Menerapkan Format Tabel pada Halaman Web )

A. Tujuan

1. Menjelaskan tag-tag html yang digunakan untuk membuat tabel
2. Menentukan prosedur pembuatan tabel dalam html
3. Menentukan penerapan format tabel dalam web
4. Menentukan prosedur pembuatan tabel dalam tabel
5. Merancang program tampilan tabel dalam html
6. Membuat program halaman web yang menampilkan tabel
7. Menguji program tampilan tabel dalam web server

B. Uraian Materi

1. Tag-tag tabel dalam html
Salah satu cara atau format menampilkan informasi dalam web adalah dengan tabel.
Tabel digunakan untuk menyajikan data dalam bentuk kolom dan baris. Umumnya
setiap kolom menunjukan data yang sejenis, dan setiap baris yang terdiri atas kolom-
kolom menunjukan kelompok data dalam satu kesatuan. Untuk membuat tabel pada
html menggunakan tag <table> dan di akhiri dengan tag </table>.

Kemudian di dalam sebuah tag <table> dan tag </table> dimasukan tag <tr> dan </tr>
yang bekerja sebagai baris pada tabel lalu di dalam sebuah <tr> dan </tr> terdapat tag
<td> dan </td> yang bekerja memberikan sebuah kolom pada tabel. Untuk mengetahui
garis tabel tersebut, kita menggunakan atribut “border” pada tag table.

Tabel terdiri dari 4 unsur utama:
1) Baris
2) Kolom
3) Sel
4) Garis

Gambar 1.c unsur tabel

Tag-tag untuk membuat tabel dalam html

Ada beberapa tag yang harus diingat 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> (tabel row) untuk membuat baris
5) Tag <td> (table data) untuk membuat sel
6) Tag <th> (table head) untuk membuat judul pada header

1