Memakai Bahasa HTML Untuk Membuat Tabel

Memakai Bahasa HTML Untuk Membuat Tabel

Tabel hampir sama dengan perintah div, perbedaannya div adalah pembagian bidang yang dapat diisi berbagai elemen sedangkan tabel adalah himpunan kotak yang memiliki border garis berdasarkan baris dan kolom. Hampir sama dengan cara membuat kotak, perbedaannya table adalah kumpulan kotak. Apabila kamu sedang mempelajari pemrograman web dengan PHP, maka tidak akan terlepas dari HTML dan database. Dari database tersebut, tentu berbentuk sebuah tabel.

Perintah Dasar Membuat Tabel di HTML :

<table border="1">
<tr>
    <th>Nama</th>
    <th>Tanggal Lahir</th>
</tr>
<tr>
    <td>Ahmad Ridwan</td>
    <td>21-03-2013</td>
</tr>
</table>

Apabila melihat contoh susunan tabel diatas, pengertian kode HTML nya adalah sebagai berikut

<table> diakhiri dengan </table> : digunakan sebagai tkamu awal tabel
<tr>..</tr> : digunakan sebagai tkamu awal baris, tr kependekan dari table row
<th>..</th> : digunakan untuk membuat tampilan kolom header tabel, th kependekan dari table head
<td>..</td> : digunakan untuk menyusun kolom data, td kependekan dari table data
Setiap elemen dari kode HTML tersebut harus tersusun dan tertata dengan benar.
Perhatikan tkamu slash / garis miring di setiap akhir elemen, itu merupakan kode penutup untuk kode pembuka di semua jenis kode HTML.

Atribut pendukung Table :

align : untuk mengatur posisi horizontal
valign : untuk mengatur posisi vertikal
width : untuk mengatur lebar
height : untuk mengatur tinggi
border : untuk mengatur tebal garis
border-color : untuk memberi tebal garis dengan warna
cellpadding : untuk mengatur jarak garis dengan objek didalamnya
cellspacing : untuk mengatur jarak tiap cell
bgcolor : untuk mengatur warna
background : untuk mengatur latar gambar
rowspan : jumlah baris yang memotong beberapa baris
colspan : jumlah kolom yang memotong beberapa kolom

Dibawah ini adalah contoh dari tabel dengan beberapa kode warna dengan atribut :

Susunan script kodenya :

<table width="510" border="1" cellspacing="0" cellpadding="3">
<tr>
<th width="58" rowspan="3" bgcolor="#00CCCC">Rowspan 3</th>
<th width="79" height="41" bgcolor="#00CCCC">Nama</th>
<th width="83" bgcolor="#33FF33">Alamat</th>
<th width="92" bgcolor="#FF9900">Telp.</th>
<th colspan="2" bgcolor="#FF9900">Colspan 2</th>
</tr>
<tr>
<td bgcolor="#66CCFF">ALI</td>
<td align="center" bgcolor="#99CC66">Jl. Ijo</td>
<td bgcolor="#9966FF">11211</td>
<td width="92" bgcolor="#9966FF"> </td>
<td width="92" bgcolor="#9966FF"> </td>
</tr>
<tr>
<td bgcolor="#FFFF00">UDIN</td>
<td align="center" bgcolor="#FFFF00">Jl. Rencong</td>
<td bgcolor="#FFFF00">23232</td>
<td bgcolor="#FFFF00"> </td>
<td bgcolor="#FFFF00"> </td>
</tr>
</table>