Kamis, 01 September 2016

Tutorial Cara Membuat Tabel di Blog Lengkap Terbaru

Advertisement

Cara Membuat Tabel di Blog - Bagi kalian yang memiliki web atau blog pasti tidak jauh dari memposting artikel. Sebab, dengan adanya artikel di web atau blog kita, dapat memicu para pengunjung untuk mengunjungi web atau blog yang menyediakan artikel yang cukup relevan dengan apa yang dicari oleh para pengunjung. Dalam membuat artikel blog pasti tidak semudah seperti membalikkan telapak tangan. Beberapa kesulitan pasti akan muncul satu persatu dan hal itu datang terus menerus. Kesulitan itulah yang sering saya rasakan ketika saya mau membuat artikel untuk blog. Bagi anda para pengunjung blog ini mungkin juga memiliki kesulitan yang hampir sama atau bahkan berbeda dari apa yang saya alami.

Dulu, kira-kira sudah lama sekali saya pernah mengalami kebuntuan dalam hal memposting terutama pada saat memposting artikel yang berhubungan dengan tabel menabel. Pada waktu itu saya bingung dan tidak tahu apa2 mengenai kode-kode yang ada pada tabel sehingga pilihan kedua saya yaitu membuat tabel sendiri di ms word dan excel lalu saya copy langsung ke blog. Alhasil tabel yang dihasilkan sedikit berat karena terlalu banyak kode yang tidak perlu dan juga tampilan yang dihasilkan tidak sesuai dengan apa yang saya bayangkan.

Tutorial Cara Membuat Tabel di Blog
Bila anda memiliki masalah yang sama seperti yang pernah saya alami, berikut saya akan berbagi kepada anda tentang cara membuat tabel lengkap dengan tutorialnya beserta beragam model tabel yang sering digunakan oleh pengguna internet. Karena saya juga masih dalam tahap belajar, jadi, bila ada kekurangan mohon kritik dan sarannya melalui form komentar dibawah. Baiklah langsung saja silakan disimak macam tabel yang perlu anda ketahui cara membuatnya agar anda bisa membuat tabel keren di artikel anda.

Tutorial Cara Membuat Tabel di Blog Seo Friendly Terbaru

1. Contoh Tabel Normal
Makanan
Minuman
Total Harga
Bakso Es Teh Rp. 50.000,-
Kode :
<table>
<tbody>
<tr>
<td><div style="text-align: center;"><b>Makanan</b></div></td>
<td><div style="text-align: center;"><b>Minuman</b></div></td>
<td><div style="text-align: center;"><b>Total Harga</b></div></td>
</tr>
<tr>
<td>Bakso</td>
<td>Es Teh</td>
<td>Rp. 50.000,-</td>
</tr>
</tbody></table>
2. Contoh Tabel dengan Ukuran
Makanan
Minuman
Total Harga
Bakso Es Teh Rp. 50.000,-
Kode :
<table style="width: 500px;">
<tbody>
<tr>
<td><div style="text-align: center;"><b>Makanan</b></div></td>
<td><div style="text-align: center;"><b>Minuman</b></div></td>
<td><div style="text-align: center;"><b>Total Harga</b></div></td>
</tr>
<tr>
<td>Bakso</td>
<td>Es Teh</td>
<td>Rp. 50.000,-</td>
</tr>
</tbody></table>
3. Contoh Tabel Seo Friendly (Sangat cocok untuk pengunjung di handphone)
Makanan
Minuman
Total Harga
Bakso Es Teh Rp. 50.000,-
Kode :
<table style="width: 100%;">
<tbody>
<tr>
<td><div style="text-align: center;"><b>Makanan</b></div></td>
<td><div style="text-align: center;"><b>Minuman</b></div></td>
<td><div style="text-align: center;"><b>Total Harga</b></div></td>
</tr>
<tr>
<td>Bakso</td>
<td>Es Teh</td>
<td>Rp. 50.000,-</td>
</tr>
</tbody></table>
4. Contoh Tabel dengan Warna Tulisan
Makanan
Minuman
Total Harga
Bakso Es Teh Rp. 50.000,-
Kode :
<table style="width: 100%;">
<tbody>
<tr style="color: blue;">
<td><div style="text-align: center;"><b>Makanan</b></div></td>
<td><div style="text-align: center;"><b>Minuman</b></div></td>
<td><div style="text-align: center;"><b>Total Harga</b></div></td>
</tr>
<tr>
<td>Bakso</td>
<td>Es Teh</td>
<td>Rp. 50.000,-</td>
</tr>
</tbody></table>
5. Contoh Tabel dengan Warna Background 
Makanan
Minuman
Total Harga
Bakso Es Teh Rp. 50.000,-
Kode :
<table style="width: 100%;">
<tbody>
<tr>
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Makanan</b></div></td>
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Minuman</b></div></td>
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Total Harga</b></div></td>
</tr>
<tr>
<td>Bakso</td>
<td>Es Teh</td>
<td>Rp. 50.000,-</td>
</tr>
</tbody></table>
6. Cara Menggabungkan Beberapa Kolom Pada Tabel
DAFTAR HARGA MAKANAN DAN MINUMAN
Makanan
Minuman
Total Harga
Bakso Es Teh Rp. 50.000,-
Kode :
<table style="width: 100%;">
<tbody>
<tr style="color: white;">
<td colspan="3" bgcolor="#00a1e0"><div style="text-align: center;"><b>DAFTAR HARGA MAKANAN DAN MINUMAN</b></div></td>
</tr>
<tr style="color: white;">
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Makanan</b></div></td>
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Minuman</b></div></td>
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Total Harga</b></div></td>
</tr>
<tr>
<td>Bakso</td>
<td>Es Teh</td>
<td>Rp. 50.000,-</td>
</tr>
</tbody></table>
7. Cara Menggabungkan Beberapa Baris Pada Tabel
DAFTAR HARGA MAKANAN DAN MINUMAN
Makanan
Minuman
Total Harga
PROMO HARGA
Bakso Es Teh Rp. 50.000,-
Mie Ayam Es Teh Rp. 100.000,-
Kode :
<table style="width: 100%;">
<tbody>
<tr style="color: white;">
<td rowspan="2"></td>
<td colspan="3" bgcolor="#00a1e0"><div style="text-align: center;"><b>DAFTAR HARGA MAKANAN DAN MINUMAN</b></div></td>
</tr>
<tr style="color: white;">
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Makanan</b></div></td>
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Minuman</b></div></td>
<td bgcolor="#00a1e0"><div style="text-align: center;"><b>Total Harga</b></div></td>
</tr>
<tr style="color: white;">
<td rowspan="3" bgcolor="#00a1e0"><div style="text-align: center;"><b>PROMO HARGA</b></div></td>
</tr>
<tr>
<td>Bakso</td>
<td>Es Teh</td>
<td>Rp. 50.000,-</td>
</tr>
<tr>
<td>Mie Ayam</td>
<td>Es Teh</td>
<td>Rp. 100.000,-</td>
</tr>
</tbody></table>
Nah, itulah cara membuat tabel di blog yang dapat saya share kali ini. Bila ada model tabel keren atau kode-kode tentang tabel lainnya akan saya posting pada kesempatan berikutnya. Model tabel diatas adalah model tabel yang sering saya pakai ketika memposting artikel yang berhubungan dengan tabel menabel.

Tags :

Related : Tutorial Cara Membuat Tabel di Blog Lengkap Terbaru

0 komentar:

Posting Komentar

Mohon gunakan bahasa yang sopan dan jangan menaruh link aktif saat berkomentar. Segala bentuk link aktif akan kami hapus. Terima Kasih.