Cara Membuat Tabel di Postingan Blog

Membuat Tabel pada Blog
Hai sobat Ladang Tutorial, lama sekali saya tidak update di blog ini. Ya begitulah, jadwal kuliah yang mulai padat membuat blog ini sedikit terbengkelai. Namun pada kesempatan kali ini Sunu akan berbagi tentang Cara Membuat Tabel di Blog. Memang ini tidak terlalu penting, tapi pasti ini akan berguna bagi sobat Ladang Tutorial nantinya.
Membuat tabel di blog itu susah-susah gampang, kita cuma bermain dengan kode HTML tag <table>, <tr>, dan <td>. Ketiga kode itu dirangkai sehingga menjadi sebuah tabel.
Sebagai contoh, copas kode berikut:
<table width="200" border="1">
  <tr>
    <td>B1K1</td>
    <td>B1K2</td>
    <td>B1K3</td>
  </tr>
  <tr>
    <td>B2K1</td>
    <td>B2K2</td>
    <td>B2K3</td>
  </tr>
  <tr>
    <td>B3K1</td>
    <td>B3K2</td>
    <td>B3K3</td>
  </tr>
</table>
Akan menghasilkan tampilan seperti ini:
B1K1 B1K2 B1K3
B2K1 B2K2 B2K3
B3K1 B3K2 B3K3

Perlu sobat Ladang Tutorial ketahui, kode <tr> itu artinya baris dan <td> itu artinya kolom.
dari contoh diatas terdapat kode <tr> sebanyak 3 buah dan <td> 9 buah. Bila sobat Ladang Tutorial ingin menambahkan atau mengurangi tabelnya, silakan hapus atau menambahkan kodenya sesuai kebutuhan. Namun hal yang perlu diingat adalah bahwa dalam penambahannya susunan kodenya harus urut.

Bagaimana cara menggunakan merge cell pada tabel postingan blog?
Untuk membuat merge cell pada tabel yang telah kita buat, kita menggunakan colspan dan rowspan.
Sebagai contoh, copy kode berikut:
<table width="200" border="1">
  <tr>
    <td colspan="2">B1K1B1K2</td>
    <td>B1K3</td>
  </tr>
  <tr>
    <td>B2K1</td>
    <td rowspan="2">B2K2B3K2</td>
    <td>B2K3</td>
  </tr>
  <tr>
    <td>B3K1</td>
    <td>B3K3</td>
  </tr>
</table>
Dan hasilnya akan seperti ini:
B1K1B1K2 B1K3
B2K1 B2K2B3K2 B2K3
B3K1 B3K3

Yup begitulah cara membuat tabel di postingan blog. Untuk cara lebih mudah dalam membuat tabel, sobat Ladang Tutorial bisa mmenggunakan software yang bernama "Dreamweaver".
Oke itu saja dari Sunu kali ini, bagi yang masih bingung silakan tinggalkan komentar :)

Terimakasih untuk sobat Ladang Tutorial yang menemukan artikel ini dengan keyword cara membuat tabel di blog, cara membuat tabel pada postingan blog, cara membuat tabel dengan kode HTML, cara menggunakan merge cell pada tabel blog, membuat merge cell dengan HTML.

Subscribe to receive free email updates:

40 Responses to "Cara Membuat Tabel di Postingan Blog"

  1. Wah, bermanfaat gan. Folback ya gan http://kata-rifal.blogspot.com

    ReplyDelete
    Replies
    1. hy, sahabat blogger indonesia yang keren dan maco. saya ingin menambahkan pupolaritas, backlink, follow, dan visitor blogku ini. Jadi saya mau promosi http://kokalu-seo.blogspot.com untuk semuanya, saya akan folback, visitback, backlinkback, dan segalanya jika anda melakukan sesuatu terhadap widget dan komentar blogku. Terimakasih telah membantu, selamat hari may day

      Delete
    2. Caranya bermanfaat kak, ini sya jga punya artikel cara Membuat Tabel pada Postingan Blog (Tanpa Coding) dilengkapi banyak gambar penjelasan, smoga bisa saling melengkapi

      http://www.markijar.com/2015/05/membuat-tabel-pada-postingan-blog-tanpa.html

      Delete
    3. http://muhzain00.blogspot.co.id/2015/12/kuis-berhadiah-pulsa-muhzain-blog.html
      Kuis Berhadiah Pulsa muhzain

      Delete
  2. wah sangat membantu sekali gan....jangan lupa mampir ya
    salam kenal
    http://volimaniak.blogspot.com/

    ReplyDelete
  3. artikel ini sudah membantu saya. terima kasih

    ReplyDelete
  4. makasih gan... artikelnya telah membantu saya
    tp ane mau nanya gmna caranya ngatur lebarnya

    ReplyDelete
    Replies
    1. ngatur lebarnya bisa dengan cara menambahkan atribut "style" pada kode html-nya.

      Delete
  5. makasih gan pencrahannya ini bisa menambah ilmu bagi yang mempraktekkan saya sedah mencoba membuat dengan cara memakai microsoft cek tampilannya :
    Tabel DRiver http://alls0ftware.blogspot.com/2014/12/free-download-canon-pixma-ip2700.html
    Tabel Software http://alls0ftware.blogspot.com/2014/12/bluestacks-app-player-free-download.html

    ReplyDelete
  6. Bermanfaat gan, makasih mtelah share tutorial ini

    ReplyDelete
  7. This comment has been removed by the author.

    ReplyDelete
  8. This comment has been removed by the author.

    ReplyDelete
  9. Mntaps gan , saya langsung peraktik , kunbalnya gan :d http://sarnujitea.blogspot.com

    ReplyDelete
  10. mantap semua artikelnya gan,sangat membantu buat pemula seperti saya,ijin copas ya gan artikelnya dan aku cantumkan juga sumbernya,kunjungi juga gan dan jangan lupa
    http://headlinenews-info.blogspot.com/

    ReplyDelete
  11. makasih broo....sudh share ilmunya ...sy sangat terbantu

    ReplyDelete
  12. Terima kasih Infonya Bro, izin ikut menerapkan ya. hehe

    Informasi Lowongan Kerja Terbaru BUMN, Persero, Swasta, & Berbagai Perusahaan Besar di Indonesia : http://expocpnsbumn.blogspot.com/

    ReplyDelete
  13. Thanks gan, tak coba di toko online gratisan lumayan juga tampilannya, agak lebih rapi. Kalo sempat silahkan berkunjung, sapa tau minat :-), http://khas-minang(dot)blogcepot(dot)com

    ReplyDelete
  14. misal backgroundnya di ganti warna caranya gimana ya gan.
    kunbal ya gan, agen wisata karimunjawa http://www.karimunjawaopentrip.blogspot.com/

    ReplyDelete
  15. keren gan ty
    http://disiniadaloker.blogspot.com/
    Tempat berbagi informasi lowongan kerja untuk wilayah Pekanbaru dan sekitaranya - Riau

    ReplyDelete
  16. ThankS gan,
    Kunjungi jga web kami>>
    http ://indocerpencom .blogspot. com/

    ReplyDelete
  17. makasih ya bermanfaat lihat dsini tampilannya
    http://www.bisnisdarirumah.co.vu/2015/04/hitungan-penghasilan-profit.html

    ReplyDelete
  18. terimakasih tutorialnya mas,,, salam kenal,, salam persahabatan
    jgn lupa bermain k blog ku ya,, hafizonline.blogspot.com

    ReplyDelete
  19. ouw jadi gitu ya cara membuat tabel,,,, baru tau :) trmksh gan atas infonya

    ReplyDelete
  20. Caranya bermanfaat kak, ini sya jga punya artikel cara Membuat Tabel pada Postingan Blog (Tanpa Coding) dilengkapi banyak gambar penjelasan, smoga bisa saling melengkapi

    http://www.markijar.com/2015/05/membuat-tabel-pada-postingan-blog-tanpa.html

    ReplyDelete
  21. Makasih bgt bro info nya, sangat bermanfaat. hehe
    Jangan Lupa mampir ke blog Lowongan Kerja Terbaru ane ya Lowongan Kerja PT Astra Internasional Tbk

    ReplyDelete

  22. CERITA DEWASAKU-INDO BUGIL HOT

    http://www.newindo.org/











    ReplyDelete
  23. Wah sangat bermanfaat gan..

    Bagi agan yang berminat belajar membuat website bisa dilihat di siyus berikut ini http://www.computer-course-center.com/web-design.html

    ReplyDelete
  24. informasinya sangat bermanfaat om.
    bagi agan yang ingin info lowongan kerja terbaru bisa mampir kesini ya
    http://carikerja-riau.blogspot.com/

    ReplyDelete
  25. Sangat bermanfaaat buat newbie seperti saya mas http://goo.gl/ALw5Oy

    ReplyDelete
  26. This comment has been removed by the author.

    ReplyDelete
  27. sangat bermamfaat kunjungi blog saya http://rizwarsugoi.blogspot.co.id/

    ReplyDelete
  28. This comment has been removed by the author.

    ReplyDelete
  29. tq. bos, minta izin kopi paste yahh... gitarkanal.blogspot.com

    ReplyDelete
  30. thanks atas informasinya
    http://triflex-capsule.xyz/

    ReplyDelete

- Mohon untuk berkomentar yang baik dan sopan.
- Dilarang berkomentar SPAM dengan cara menuliskan alamat link.
- Terimakasih telah membantu kemajuan blog ini dengan berbagai pertanyaan kalian.