Untuk menghemat halaman apalagi anda banyak memasukkan gambar atau foto yang kecil2 maka sangat dibutuhkan sekali adanya tabel dengan beberapa kolom sehingga halaman anda tidak terlalu panjang ke bawah seperti contoh blog saya www.webtugumas.blogspot.com menjadi cantik bukan? nah untuk membuatnya silahkan anda coba script seperti dibawah ini pada blog anda.
Tabel 1 kolom 1 baris posisi di sisi kiri:
<table border="1" style="width: 300px;"><tbody>
<tr> <td align="center">Contoh</td> </tr>
</tbody></table>
Hasilnya:
| Contoh |
Agar posisi tabel bisa ke tengah anda tinggal menambahkan:
margin-left: auto; margin-right: auto; text-align: left; setelah <table border="1" style=" dan
<div style="text-align: center;">
</div> diakhir script
Tabel 1 kolom 1 baris posisi ditengah:
<table border="1" style="margin-left: auto; margin-right: auto; text-align: left; width: 300px;"><tbody>
<tr> <td align="center">Contoh</td> </tr>
</tbody></table>
<div style="text-align: center;">
</div>
hasilnya:
| Contoh |
Tabel 2 kolom 4 baris:
<table border="1" style="margin-left: auto; margin-right: auto; text-align: left; width: 300px;"><tbody>
<tr> <td align="center">Contoh</td> </tr>
<tr> <td align="center">Contoh</td> </tr>
<tr> <td align="center">Contoh</td> </tr>
<tr> <td align="center">Contoh</td> </tr>
</tbody></table>
<div style="text-align: center;">
</div>
hasilnya:
| Contoh |
| Contoh |
| Contoh |
| Contoh |
Tabel 2 kolom 4 baris:
<table border="1" style="margin-left: auto; margin-right: auto; text-align: left; width: 300px;"><tbody>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
</tbody></table>
<div style="text-align: center;">
</div>
hasilnya:
| Contoh | contoh |
| Contoh | contoh |
| Contoh | contoh |
| Contoh | contoh |
Tabel 3 kolom 4 baris:
<table border="1" style="margin-left: auto; margin-right: auto; text-align: left; width: 300px;"><tbody>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">contoh</td> </tr>
</tbody></table>
<div style="text-align: center;">
</div>
Hasilnya:
| Contoh | contoh | contoh |
| Contoh | contoh | contoh |
| Contoh | contoh | contoh |
| Contoh | contoh | contoh |
Tabel 4kolom 4baris:
<table border="1" style="margin-left: auto; margin-right: auto; text-align: left; width: 300px;"><tbody>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
<tr> <td align="center">Contoh</td> <td align="center">contoh</td> <td align="center">Contoh</td> <td align="center">contoh</td> </tr>
</tbody></table>
<div style="text-align: center;">
</div>
hasilnya:
| Contoh | contoh | Contoh | contoh |
| Contoh | contoh | Contoh | contoh |
| Contoh | contoh | Contoh | contoh |
| Contoh | contoh | Contoh | contoh |
Selamat mencoba dan semoga sukses!
