Thursday, February 14, 2013

Membuat Tabel Sederhana di HTML

Untuk membuat tabel sederhana tanpa embel-embel lainnya (misalnya judul tabel, penggabungan kolom, baris), bisa gunakan tiga elemen: TABLE, TR, TH, dan TD.

Contoh kode berikut membuat tabel sederhana:

<TABLE BORDER="1"> <TR> <TH>Table header</TH> <TH>Table header</TH> </TR> <TR> <TD>Table data</TD> <TD>Table data</TD> </TR> </TABLE>

Untuk tabel yang sedikit rumit, anda perlu melibatkan elemen CAPTION, TBODY, TFOOT, THEAD, COL, COLGROUP, ditambah dengan pengaturan atribut setiap elemennya.

Tag <TABLE> adalah tag yang harus dituliskan pertama kali untuk membuat suatu tabel.

  • Jika menginginkan border tabel yang dibuat ditiadakan, set atribut BORDER="0" atau hilangkan penggunaan atribut BORDER.
  • Jika menginginkan border tabel yang dibuat lebih tebal, set atribut BORDER ke nilai lebih dari "1", semakin besar nilai yang diberikan, semakin tebal border yang dihasilkan.

Elemen TR diperlukan untuk pembuatan tabel, dia berguna membuat baris tabel. Banyaknya baris suatu tabel ditentukan oleh elemen ini. Untuk tabel di atas, baris yang dibuat sebanyak 2.

Elemen TH dan TD, keduanya berguna untuk menyimpan data-data tabel. Secara default, isi elemen TH ditampilkan dengan huruf tebal dan rata tengah.

Bagaimana keluaran dari contoh kode di atas adalah seperti berikut:

Table header Table header
Table data Table data