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 : 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.
- <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.
<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.
Tidak ada komentar:
Posting Komentar