Berikut uraiannya:
| Tag | Parent | Fungsi |
| <table> </table> | --- | tag utama |
| <caption> </caption> | <table> | Menampilkan judul tabel |
| <tr></tr> | <table> | Tag baris |
| <th></th> | <tr> | Header table |
| <td></td> | <tr> | Tag sel-sel tabel |
Berikut ini beberapa atribut tag tabel
| Atribut | Fungsi |
| bgcolor | warna background |
| width, height | lebar / tinggi tabel (dalam % atau pixel) |
| cellspacing | jarak antar cell |
| cellpadding | jarak teks ke cell |
| border | lebar garis batas, 0=tanpa garis batas |
Berikut ini atribut tag-tag <th> dan <td>, bila disebutkan
di tag <tr> maka atribut di tag <th> dan <td> diabaikan
| Atribut | Fungsi |
| bgcolor | warna background |
| width, height | lebar/tinggi tabel (dalam % atau pixel) |
| align (left, right, center) | pengaturan posisi rata kanan/kiri/tengah |
| valign (top, bottom, middle) | pengaturan posisi vertikal terhadap isi sel, di atas, bawah atau tengah |
| colspan=n | ekstensi (span) n jumlah kolom ke kanan |
| rowspan=n | ekstensi (span) n jumlah kolom baris ke bawah |
| nowrap | mematikan word wrapping |
Contoh pembuatan table 1;
<table width="100%" border="0" cellspacing="1" cellpadding="5" bgcolor="yellow">
<tr>
<th>sel 1</th>
<th>sel 2</th>
<th>sel 3</th>
</tr>
<tr>
<td align=left> sel 4</td>
<td align=center>sel 5</td>
<td align=right>sel 6</td>
</tr>
<tr bgcolor="orange">
<td width="100" height="75" valign=top>sel 7</td>
<td width="35%" height="75" valign=middle>sel 8</td>
<td height="75" valign=bottom>sel 9</td>
</tr>
</table>
Hasilnya:
| sel 1 | sel 2 | sel 3 |
|---|---|---|
| sel 4 | sel 5 | sel 6 |
| sel 7 | sel 8 | sel 9 |
Contoh pembuatan table 2:
<table width="100%" border="2" cellspacing="5" cellpadding="5" bgcolor="#9999CC">
<tr>
<td width="30%"> </td>
<td colspan="3">colspan=3</td>
</tr>
<tr>
<td rowspan="4" bgcolor="#FFFF00">rowspan=4</td>
<td width="20%"> </td>
<td bgcolor="white" width="20%"> </td>
<td bgcolor="white" width="20%"> </td>
</tr>
<tr>
<td width="31%"> </td>
<td bgcolor="white"> </td>
<td bgcolor="white"> </td>
</tr>
</table>
Hasilnya;
| colspan=3 | |||
| rowspan=4 | |||
Membuat tabel bagian 2

Tidak ada komentar:
Posting Komentar