Cara Membuat Tabel Dalam Postingan Blog



 Kita bisa membuat tabel dengan menggunakan software seperti microsoft word atau microsoft excel. Namun, tentunya hal tersebut membuat kita agak ribet karena harus memindahkannya lagi kedalam postingan Blog.Pada kesempatan kali ini saya akan memberikan panduan tentang bagaima cara untuk membuat tabel dalam postingan di blog.

 Untuk membuat tabel di blog kita hanya memerlukan beberapa kode html saja, yang nantinya akan kita gunakan dalam pembuatan tabel, berikut kode-kode html tersebut:



table : Bagian dari tabel bisa dimodifikasi dengan warna,panjang lebarnya dan style bordernya.
tr : Merupakan baris pada tabel.
td : Merupakan kolom pada tabel.

Sekarang kita akan mencoba membuat tabel 2 kolom, maka kita cukup menuliskan kode HTML nya seperti ini.



Maka tampilannya akan terlihat seperti ini.

Kolom Satu Kolom Dua


Jika ingin menambah kolom menajdi 3 atau 4 cukup tambahkan <td> Kolom Ketiga </td> sebelum kode </tr></table> jadi hasil tampilannya akan seperti ini.




Jadi tampilannya akan terlihat seperti ini.

Kolom Satu Kolom Dua Kolom Ketiga


Kolom Satu Kolom Dua Kolom Ketiga Kolom Keempat


Selanjutnya kita akan mencona membuat tabel 2 kolom kesamping dan 2 kolom kebawah.



Maka tampilnnya akan terlihat seperti ini.

Kolom Satu A Kolom Satu B
Kolom Dua A Kolom Dua B


Jika 3 kolom kesamping dan 2 kolom kebawah,cukup menambahkan kode <td>Kolom Ekstra</td> diantara kode <tr> dan </tr> pertama dan kedua.



Jadi tampilannya akan terlihat seperti ini.

Kolom Satu A Kolom Dua A Kolom Ekstra 1
Kolom Satu B Kolom Dua B Kolom Ekstra 2


Membuat 3 kolom kesamping dan 3 kolom kebawah,anda cukup menambahkan kode ini sebelum kode </table>.



Maka tampilan kode HTMLnya seperti ini.



Dan tampilannya akan terlihat seperti ini.

Kolom Satu A Kolom Satu B Kolom Satu C
Kolom Dua A Kolom Dua B Kolom Dua C
Kolom Tiga A Kolom Tiga B Kolom Tiga C


Tabel dengan background warna warni 2 kolom dan 5 baris dengan posisi huruf di tengah.



Maka Tampilannya akan terlihat seperti ini.

Kolom 1Kolom 2
Baris ke 2Baris ke 2
Baris ke 3Baris ke 3
Baris ke 4Baris ke 4
Baris ke 5Baris ke 5


table widh="550" : lebar dari tabel tersebut,anda bisa menyesuaikan dengan selera anda.
Kolom Satu, Kolom Satu A : Tempat untuk memasukkan tulisan,keterangan ataupun link.

Mungkin hasilnya tidak akan sama dengan contoh tabel yang di atas dikarenakan setiap template CSSnya berbeda beda.Selamat mencoba.
Baca Juga

Subscribe to receive free email updates:

0 Response to "Cara Membuat Tabel Dalam Postingan Blog"

Post a Comment