You are here → Home √ Menggabungkan Baris dan Kolom pada Tabel

Menggabungkan Baris dan Kolom pada Tabel

Dipublikasikan oleh Ilham Bachtiar pada Saturday, November 2, 2013

Setelah pengenalan, pembuatan, dan menambahkan baris dan kolom yang sudah kita pelajari pada postingan sebelumnya. Bagi yang belum mengerti bisa membaca postingan sebelumnya terlebih dulu tentang cara membuat tabel dan bagaimana menambahkan baris dan kolom pada tabel, bisa langsung ikuti link tulisan tersebut. Kali ini bergulir pada cara menggabungkan baris dan kolom pada tabel.

Tidak semudah membuat tabel pada Microsoft Exel maupun Word, untuk menggabungkan baris dan kolom tabel di postingan blog agar terlihat lebih bagus dan rapi sedikit lebih rumit. Karena kita harus memahami sedikit tentang perintah HTML-nya. Jangan khawatir bagi kalian yang tidak begitu mengerti tentang HTML, saya pun begitu masih belum mengerti. Tapi, menurut saya ini hanya perintah mudah yang bisa dipelajari siapapun. Untuk lebih jelasnya baca urain dibawah.

Menggabungkan kolom

<table border="2" width="400">
<tr>
<td colspan="2">Gabungan Kolom</td>
</tr>
<tr>
<td>Baris 2 - Kolom 1</td>
<td>Baris 2 - Kolom 2</td>
</tr>
<tr>
<td>Baris 3 - Kolom 1</td>
<td>Baris 3 - Kolom 2</td>
</tr>
</table>
Kode diatas adalah untuk penggunaan tabel dengan penggabungan 2 kolom yang ada pada baris pertama (Perhatikan bagian "Gabungan Kolom"). Untuk membuat seperti itu kalian harus menambahkan perintah colspan pada td atau kolom. Bisa dilihat diatas saya menggunakan perintah tersebut dengan <td colspan="2">. Artinya, saya menggabungkan 2 kolom. Jika kalian ingin menggabungkan lebih dari dua kolom, harus merubah angka 2 setelah kode colspan. Hasil kode diatas akan seperti berikut:

Gabungan Kolom
Baris 2 - Kolom 1 Baris 2 - Kolom 2
Baris 3 - Kolom 1 Baris 3 - Kolom 2

Menggabungkan Baris

Pada dasarnya untuk menggabungkan baris tabel, penggunaannya sama persis dengan menggabungkan kolom jadi penjelasannya tidak akan saya ulang. Perbedaan hanya terletak pada perintah yang digunakan, jika tadi perintahnya adalah colspan untuk menggabungkan kolom makan rowspan untuk menggabungkan baris. Bisa diperhatikan sendiri pada kode dibawah bagaimana pengaplikasiannya.

<table border="2" width="400">
<tr>
<td colspan="2">Gabungan Kolom</td>
</tr>
<tr>
<td rowspan="2">Baris 2 - Kolom 1</td>
<td>Baris 2 - Kolom 2</td>
</tr>
<tr>
<td>Baris 3 - Kolom 2</td>
</tr>
</table>

Kkode diatas adalah kode yang sebelumnya hanya menggabungkan kolom dan saya tambahkan panggabungan baris pada baris pertama-kolom 2 dan 3. Hasilnya akan terlihat seperti berikut :

Gabungan Kolom
Baris 2 - Kolom 1
Baris 2 - Kolom 2
Baris 3 - Kolom 2

Selesai sudah mengenai tabel, dimulai dengan pengenalan juga cara pembuatan tabel, kemudian bagaimana cara menambahkan baris dan kolom dan sekarang yang baru saja kita pelajari cara menggabungkan baris dan kolom. Semoga bermanfaat. ***

49 Komentar:

  1. saya masih mengikuti tutorialnya sob, ini lanjutan yang kemarin kan..makasih sharingnya..

    ReplyDelete
  2. izin nyimak nih gan, udah lama ane kagak ke sini nihm, heheheh

    ReplyDelete
  3. My brother suggested I might like this web site.
    He was totally right. This post truly made my day.

    You cann't imagine just how much time I had spent for this info!
    Thanks!

    Also visit my blog ... autorijschool hilversum

    ReplyDelete
  4. This is a topic which is near to my heart... Best wishes!
    Exactly where are your contact details though?

    Feel free to visit my blog post How to get your ex boyfriend back after being Needy

    ReplyDelete
  5. You really make it seem so easy with your presentation but I find this topic to be actually something that I think I would never understand.
    It seems too complex and very broad for me. I'm looking forward for your next post, I will try to get the hang of it!


    Visit my webpage: Sardar SMS

    ReplyDelete
  6. Numpang lewat ya gan :)

    http://idr-poker.blogspot.com/

    http://beritaolahraga108.blogspot.com/

    http://lihatberitaakurat.blogspot.com/

    http://liatberitabola.blogspot.com/

    http://beritaolahraga1081.blogspot.com/

    http://infobolakakiterbaru.blogspot.com/

    http://beritasportsterpercaya.blogspot.com/

    http://seputarberitabola108.blogspot.com/

    http://beritaterbaruseputarolahraga.blogspot.com/

    http://agen-bola-sbobet-jagad303.blogspot.com/

    ReplyDelete
  7. mantap infonya, berhasil nih
    http://kulinersemarank.blogspot.com/

    ReplyDelete
  8. Thank infonya gan..
    Bagi agan yang berminat belajar membuat website bisa dilihat disitus berikut ini Belajar Membuat Webiste

    ReplyDelete
  9. I Got The Best Birthday Status Site All Type Of Status Are Here Please Check It Out.Best Birthday Wishes Zone

    ReplyDelete
  10. I read all of article of the site the article was very nice go and check it out!
    networthbox

    ReplyDelete
  11. http://www.minimilitiapropack.com/2016/05/20/mini-militia-unlimited-ammo-hack/

    ReplyDelete
  12. Kami dari VIPBANDARQ.COM Mengadakan SEO Kontes atau Kontes SEO yang akan di mulai pada tanggal 01 April 2016 - 05 Agustus 2016,

    dengan Total Hadiah Rp. 35.000.000,- Ikuti dan Daftarkan diri Anda untuk memenangkan dan ikut menguji kemampuan SEO Anda. Siapkan website terbaik Anda untuk mengikuti kontes ini.

    Buktikan bahwa Anda adalah Ahli SEO disini. Saat yang tepat untuk mengetest kemampuan SEO Anda dengan tidak sia-sia, hadiah kontes ini adalah Rp 35.000.000,-

    Tunggu apa lagi?

    Kontes SEO ini akan menggunakan kata kunci (Keyword) VIPBANDARQ.COM | BANDARQ | GAME BANDARQ | CAPSA ONLINE | BANDAR POKER | AGEN DOMINO99 Jika Anda cukup percaya akan kemampuan SEO Anda,

    silahkan daftarkan web terbaik Anda SEKARANG JUGA! Dan menangkan hadiah pertama Rp. 13.000.000. Keputusan untuk Pemenang Akan di tentukan dengan aturan kontes SEO yang dapat dilihat di halaman ini.

    Tunggu apa lagi? Ikuti kontes ini sekarang juga!

    CONTACT US:
    - PIN BB : 33449B3B / 7AD1123F
    - Ym35jt : Vip Bandaq Q
    - Facebook : Vip Bandaq Q
    - Phone: +855 87781506

    ReplyDelete
  13. Let that be a warning to you. As with everything else, it's the thought that counts. That was heart pounding. Some of you have figured what works best with Juggernox.

    We are still trying to deal with the kinks of Juggernox. Customers will now go to a specific Juggernox store to do that although often we locate this blunt words have the sharpest edge. Each Juggernox is different than the last. Try it out.>>>http://www.kingsizemaleenhancements.com/juggernox/

    ReplyDelete
  14. I wouldn't continue to do it if Juggernox wasn't profitable. The smart money is on Juggernox. What you need to do is concentrate on Juggernox later. I am assured by Juggernox. It is a sneaky method of getting a Juggernox which you desperately want. >>>http://www.kingsizemaleenhancements.com/juggernox/

    ReplyDelete

 
Copyright © 2013 Obachti 95 . Powered by Blogger . All Rights Reserved