Cara Membuat Tabel Di Blog
Mungkin pertanyaan ini pernah muncul di fikiran anda, yah tentunya ini di sebabkan karena artikel atau isi blog kita tersebut memerlukan adanya tabel.
Tapi ga pakai tabel kan bisa juga?...
Bisa sih... tapi kan kurang bagus di lihatnya dan kurang jelas, dengan adanya tabel kita bisa memperjelas tujuan kita, selain itu akan terlihat lebih mantap, iya to...
Cara Membuat Tabel Di BloggerCara Membuat Tabel Di Blogspot
Contoh:
Misalnya ketika kita menjual beberapa produk di blog kita, dan kita ingin membuat sebuah halaman kusus dimana halaman tersebut akan kita isi dengan semua produk yang kita tawarkan, tentu kita perlu membuat tabel, iya kaga?...
Okey, mari kita kembali ke topik utama yaitu Cara Membuat Tabel Di Blog Blogger.
Untuk membuat tabel di blogger kita hanya perlu beberapa kode html saja, yang nantinya akan kita gunakan dalam pembuatan tabel, berikut kode-kode html tersebut:
<em>Ampersands & angle brackets need to be encoded.</em><table> dan </table>
<tr> dan </tr>
<td> dan </td>
Beneran cuma itu saja kode yang di perlukan untuk membuat tabel?...
YA... cukup dengan 3 atau 6 kode tersebut saja kita bisa membuat tabel. tapi ada sedikit kode tambahan sih...
:ahaha:
Mari kita mulai praktek. Silahkan sambil di fahami ya, soalnya kalau terlalu detail nanti artikelnya kepanjangan.
1. Membuat Tabel 2 Kolom kesamping dan 1 kolom kebawah, maka kita cukup menuliskan kode html berikut:
<table width="500" border="1">
<tr>
<td>Kolom 1 </td>
<td>Kolom 2 </td>
</tr>
</table>
Dan Hasilnya akan terlihat seperti ini:
Kolom 1 Kolom 2
Jika ingin merubahnya menjadi 3 kolom kesamping dan 1 kolom kebawah anda cukup menambahkan kode
Kolom 1 Kolom 2 Kolom 3
1. Membuat Tabel 2 Kolom kesamping dan 2 kolom kebawah, maka kita cukup menuliskan kode html berikut:
<table width="500" border="1">
<tr>
<td>Kolom 1 A </td>
<td>Kolom 1 B </td>
</tr>
<tr>
<td>Kolom 2 A </td>
<td>Kolom 2 B </td>
</tr>
</table>
Hasilnya Seperti ini:
Kolom 1 A Kolom 1 B
Kolom 2 A Kolom 2 B
Jika ingin merubahnya menjadi 3 kolom kesamping dan 2 kolom kebawah anda cukup menambahkan kode
Contoh:
<table width="500" border="1">
<tr>
<td>Kolom 1 A</td>
<td>Kolom 2 A</td>
<td>Kolom Tambahan 1</td>
</tr>
<tr>
<td>Kolom 1 B</td>
<td>Kolom 2 B</td>
<td>Kolom Tambahan 2 </td>
</tr>
</table>
Maka hasilya seperti ini
Kolom 1 A Kolom 2 A Kolom Tambahan 1
Kolom 1 B Kolom 2 B Kolom Tambahan 2
1. Membuat Tabel 3 Kolom kesamping dan 3 kolom kebawah. jika ingin membuat tabel 3 kolom kesamping dan kebawah maka anda cukup menambahkan kode ini sebelum kode
<table width="500" border="1">
<tr>
<td>Kolom 1 A </td>
<td>Kolom 1 B </td>
<td>Kolom 1 C </td>
</tr>
<tr>
<td>Kolom 2 A </td>
<td>Kolom 2 B </td>
<td>Kolom 2 C </td>
</tr>
<tr>
<td>Kolom 3 A </td>
<td>Kolom 3 B </td>
<td>Kolom 3 C </td>
</tr>
</table>
Hasil kode htmlnya akan seperti ini
| Kolom 1 A | Kolom 1 B | Kolom 1 C |
| Kolom 2 A | Kolom 2 B | Kolom 2 C |
| Kolom 3 A | Kolom 3 B | Kolom 3 C |
Dan hasil tabelnya akan terlihat seperti ini
Kolom 1 A Kolom 1 B Kolom 1 C
Kolom 2 A Kolom 2 B Kolom 2 C
Kolom 3 A Kolom 3 B Kolom 3 C
Keterangan :
Pada tulisan yang saya tulis kolom 1, kolom 1A, kolom 2, dst adalah tempat untuk memasukkan tulisan, link, atau gambar anda. Silahkan ganti sesuai keperluan.
Sedangkan kode ini.
Tidak ada komentar:
Posting Komentar