Cara Membuat Tabel HTML

Kali ini saya ingin berbagi pengalaman bagaimana membuat tabel html di bagian postingan blog. Sebenarnya hal ini sudah sering dibahas oleh sekian banyak blogger, tapi tidak ada salahnya jika di blog ini juga akan membahas mengenai hal tersebut. Tentunya dengan tampilan yang berbeda.

Untuk membuat table HTML sangatlah mudah. Intinya pahami struktur kode html berikut ini :

<table border="1">
<tr>
<td>baris 1, kolom 1</td>
<td>baris 2, kolom 2</td >
</tr>

<tr>
<td >baris 2, kolom 1</td >
<td >baris 2, kolom 2</td >
</tr>
</table>

maka hasilnya adalah berikut ini :

baris 1, kolom 1	baris 2, kolom 2
baris 2, kolom 1	baris 2, kolom 2

Kode <table>  menunjukkan awal dimulainya kode membuat
tabel, dan harus ditutup dengan kode </table>. Sedangkan <tr> menunjukkan dimulainya baris, dan <td> menunjukkan awal kolom.

Kalau kita ingin menambahkan informasi header diatasnya, maka coba perhatikan contoh berikut ini :

<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>baris 1, cell 1</td>
<td>baris 1, cell 2</td>
</tr>
<tr>
<td>baris 2, kolom 1</td>
<td>baris 2, kolom 2</td>
</tr>
</table>


maka hasilnya adalah sebagai berikut : 

Header 1	Header 2
baris 1, kolom 1	baris 1, kolom 2
baris 2, kolom 1	baris 2, kolom 2

pada kode diatas terlihat ada tambahan kode <th>Header 1</th> dan <th>Header 2</th> sebagai kolom header.


Selamat mencoba!


Note : pemanfaatan tabel juga bisa digunakan untuk memasang gambar yang berjajar seperti contoh dibawah ini :