sebelum kita belajar membuat table dengan Html, alangkah baiknya kita mengenal dulu kode apa saja yang biasa di pakai saat membuat table tersebut, di bawah ini ada beberapa kode yang bisa di pakai untuk membuat table
| kode HTML | keterangan |
|---|---|
| <table> | didevinisikan untuk table pembuka, dan selalu di akhiri dengan kode </table> |
| <th> | didevinisikan sebagai tabel header |
| <tr> | didevinisikan sebagai table row atau baris |
| <td> | table cell atau kolom |
| <tbody> | body tabel atau group pada body tabel |
| width=" " | adalah lebar tabel yang di inginkan |
| bgcolor="" | digunakan untuk mewarnai background body, header, baris, kolom |
| border="" | itu adalah kode untuk mengatur berapa besar garis tepi table |
sebenarnya masih banyak lagi kode yang di pakai untuk membuat table, tapi kita cukup mebuatnya dengan :
<table></table>
border=""
<tr></tr>
<td></td>
seperti contoh saat kita menuliskan kode dibawah ini:
maka akan menjadi sebuah table seperti ini :
kita coba membuat tiga kolom
maka akan menjadi tabel seperti dibawah ini:
dan coba buat dengan menggunakan 4 kolom
Maka akan menjadi sebuah tabel seperti di bawah ini :
<table></table>
border=""
<tr></tr>
<td></td>
seperti contoh saat kita menuliskan kode dibawah ini:
| <table border="1">
<tr>
<td>kolom1</td>
<td>kolom2</td>
</tr>
</table>
|
maka akan menjadi sebuah table seperti ini :
| kolom1 | kolom2 |
kita coba membuat tiga kolom
| <table border="1"> <tr> <td>baris1 kolom1</td> <td>baris1 kolom2</td> </tr> <tr> <td>baris2 kolom1</td> <td>baris2 kolom2</td> </tr> <tr> <td>baris3 kolom1</td> <td>baris3 kolom2</td> </tr> </table> |
maka akan menjadi tabel seperti dibawah ini:
| baris1 kolom1 | baris1 kolom2 |
| baris2 kolom1 | baris2 kolom2 |
| baris3 kolom1 | baris3 kolom2 |
dan coba buat dengan menggunakan 4 kolom
| <table border="1"> <tr> <td>NAMA</td> <td>ALAMAT</td> </tr> <tr> <td>ANDIKA</td> <td>jl Pemuda no,12 SEMARANG 57684</td> </tr> <tr> <td>DWI PUJANGGA</td> <td>Jl Perintis kemerdekaan no.45 Jakarta Utara 56071</td> </tr> <tr> <td>FISTA CALISTA</td> <td>JL asmara menuju kolam cinta</td> </tr> <tr> <td>ARUM MEWANGI SEPANJANG HARI</td> <td>JAKARTA PUSAT</td> </tr> </table> |
Maka akan menjadi sebuah tabel seperti di bawah ini :
| NAMA | ALAMAT |
| ANDIKA | jl Pemuda no,12 SEMARANG 57684 |
| DWI PUJANGGA | Jl Perintis kemerdekaan no.45 Jakarta Utara 56071 |
| FISTA CALISTA | JL asmara menuju kolam cinta |
| ARUM MEWANGI SEPANJANG HARI | JAKARTA PUSAT |