CARA MEMBUAT TABLE DI BLOG

CARA MEMBUAT TABLE DI BLOG

Fungsi table merupakan salah satu hal yang penting dalam memodifikasi sebuah blog.

Mungkin bagi Anda yang ingin membuat toko online bisa saja memanfaatkannya untuk memajang dagangan atau product anda dalam sebuah table.
Kita bisa membuat table dengan beberapa kolom sesuai dengan keinginan dan kebutuhan.

Di sini saya ingin menunjukkan bagaimana cara membuat table di blog mulai dari satu kolom sampai beberapa kolom. Tentu saja ini ditujukan bagi Anda yang belum tahubagaimana cara membuat table di blog.

Beberapa attribute yang biasa digunakan untuk membuat table adalah : 

• <table> ditutup dengan </table>
• <tr> ditutup dengan </tr> : ini merupakan baris table.
• <td> ditutup dengan </td> : Dan yang ini merupakan baris table yang letaknya di dalam <tr> </tr>
• Cellspasing : jarak antara kolom.
• Cellpadding : jarak di dalam kolom.
• Colspan : menyesuaikan jumlah kolom.

Contoh table dengan satu kolom:  

<table border="1" style="width:"auto">
<tr>
<td>satu kolom</td>
</tr>
</table>
 

satu kolom

Dan yang ini untuk yang dua kolom.  

<table border="1" style="width:"auto">
<tr>
<td>dua kolom</td>
<td>dua kolom</td>
</tr>
</table>
 

dua kolom

dua kolom

Contoh table satu baris kolom.  

<table border="1" style="width:"auto">
<tr>
<td>satu baris kolom</td>
</tr>
<tr>
<td>satu baris kolom</td>
</tr>
</table> 

satu baris kolom

satu baris kolom

Ini untuk yang dua baris kolom.  

<table border="1" style="width:"auto">
<tr>
<td>dua baris kolom</td>
<td>dua baris kolom</td>
</tr>
<tr>
<td>dua baris kolom</td>
<td>dua baris kolom</td>
</tr>
</table>
 

dua baris kolom	dua baris kolom
dua baris kolom	dua baris kolom

Dengan cara di atas Anda bisa menambahkan menjadi beberapa kolom.
Sekarang kita coba untuk menambahkan beberapa attribute.

<table border="1" bgcolor=""  cellpadding="5" cellspacing="5"

style="width:"auto"gt;
<tr>
<td align="center" colspan="5"> Table </td></tr>
<tr>
<td align="left" bgcolor=""> cell colspan 1 </td>
<td align="left" bgcolor=""> cell colspan 2 </td>
<td align="left" bgcolor=""> cell colspan 3 </td>
<td align="left" bgcolor=""> cell colspan 4 </td>
<td align="left" bgcolor=""> cell colspan 5 </td>
<tr/>
</table>
 

Table
cell colspan 1	cell colspan 2	cell colspan 3	cell colspan 4	cell colspan 5

Mungkin Anda ingin membuat gallery photo untuk sebuah toko online, Anda juga bisa memajang dagangan atau produk Anda menggunakan sebuah table.

Contoh table photo gallery untuk toko online :
  
<table border="1" bgcolor="#00FF66"  cellpadding="5" cellspacing="5" style="width:"300px;">
<tr>
<td align="center" bgcolor="#FFCCFF" colspan="5"><img src="http://letakkan gambar Anda di sini.jpg" alt="Gallery" width="300" height="150"> </td></tr>
<tr>
<td align="left" bgcolor=""> Jenis product 1 </td>
<td align="left" bgcolor=""> Nama </td>
</tr>
<tr>
<td align="left" bgcolor="">Harga </td>
<td align="left" bgcolor="">Mata uang</td>
</tr>
<tr>
<td align="left" bgcolor="">keterangan</td>
<td align="left" bgcolor="FFFF00">Order</td>
<tr/>
</table>
 

Jenis product :	Nama
Harga :	Mata uang
keterangan	Order

Selanjutnya Anda bisa memodifikasi cara membuat table di atas dengan kreasi Anda sendiri.