membuat tabel

Membuat Tabel
Dengan menggunakan contoh script tabel dibawah ini, akan menghasilkan tabel sederhana dengan 2 kolom dan 3 baris, dengan tambahan atribut border="1" untuk ketebalan border pada tabel.

HTML

<table border="1">

<tr>

<td>Baris 1 - Kolom 1 - Sel 1</td>

<td>Baris 1 - Kolom 2 - Sel 2</td>

</tr>

<tr>

<td>Baris 2 - Kolom 1 - Sel 3</td>

<td>Baris 2 - Kolom 2 - Sel 4</td>

</tr>

<tr>

<td>Baris 3 - Kolom 1 - Sel 5</td>

<td>Baris 3 - Kolom 2 - Sel 6</td>

</tr>

</table>

Dari contoh tabel sederhana diatas, kita bisa tambahkan judul/title sel dengan menggunakan tag <th> sebagai header sel. Secara default teks yang berada pada pada tag <th> akan berada pada tengah-tengah (center).

HTML

<table border="1">

<tr>

<th>Header Kolom 1</th>

<th>Header Kolom 2</th>

</tr>

<tr>

<td>Baris 1 - Kolom 1 - Sel 1</td>

<td>Baris 1 - Kolom 2 - Sel 2</td>

</tr>

<tr>

<td>Baris 2 - Kolom 1 - Sel 3</td>

<td>Baris 2 - Kolom 2 - Sel 4</td>

</tr>

<tr>

<td>Baris 3 - Kolom 1 - Sel 5</td>

<td>Baris 3 - Kolom 2 - Sel 6</td>

</tr>

</table>

Tag HTML <thead> <tbody> <tfoot>
Fungsi dari ketiga tag tersebut adalah untuk mengelompokan data sel pada tiap bagiannya (header, body dan footer pada table), dengan tambahan css tentunya tampilan tabel akan lebih baik, khususnya untuk ketiga tag tersebut. Untuk penggunaan tag <thead> <tbody> <tfoot> perhatikan script dibawah ini:

HTML

<table border="1">

<thead>

<tr>

<th>Mata Pelajaran</th>

<th>Nilai</th>

</tr>

</thead>

<tbody>

<tr>

<td>Matematika</td>

<td>8</td>

</tr>

<tr>

<td>Komputer</td>

<td>6</td>

</tr>

</tbody>

<tfoot>

<tr>

<td>Jumlah</td>

<td>14</td>

</tr>

</tfoot>

</table>