Pada penggunaan PHP, salah satu elemen yang sering digunakan adalah
membuat
tabel dengan html disertai kode warna CSS.
Tabel
merupakan salah satu objek yang terbentuk dari beberapa garis dan bidang
yang membentuk sebuah kotak.
Tabel ini 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.
HTML banyak sekali digunakan untuk menyusun objek, gambar, tulisan,
layout, bidang ruang, tampilan halaman dan sebagainya. Apabila anda
sedang mempelajari pemrograman web dengan PHP, maka tidak akan terlepas
dari HTML dan database. Dari database tersebut, tentu berbentuk sebuah
tabel. Oleh karena itu sangat penting bagi kita untuk mengetahui kode
yang merupakan elemen pemasangan sebuah tabel.
Terlebih dahulu kita akan mengenal perintah kode-kode yang berhubungan
dengan 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 tanda
awal tabel
<tr>..</tr> : digunakan sebagai tanda 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 tanda 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
Berikut 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>
Tabel memang sangat banyak digunakan mulai dari Microsoft Excell,
Microsoft Word, Microsoft Powerpoint, Adobe Dreamweaver dan lainnya.
Demikian tutorial dan
dasar
cara membuat table html dengan css. Semoga dapat
membantu anda dalam membuat website, design blog, laporan kerja, dll.
TERIMA KASIH TELAH MEMBACANYA,,,,,,SEMOGA BERMANFAAT ^^
Pembaca yang baik adalah pembaca yang meninggalkan komentar setelah membaca... ^.^
>>>SILAHKAN BERKOMENTAR<<<
Silahkan COPY vs PASTE artikel di blog ini, tapi bawa juga LINK saya. http://noviapriandewi.blogspot.com/
Follow Me at twetter@Novi_priell
