Februari 25, 2012

Menggabungkan Kolom Dan Baris Dalam Tabel

Situseo Blog : Sekarang kita sudah memahami cara membuat sebuah tabel dalam sebuah posting, tulisan ini merupakan sambungan dari cara membuat tabel dalam postingan, bagi yang belum mengetahui cara membuat tabel sebaiknya melihat caranya dengan meng-klik link tersebut. Dalam sebuah tabel kadang kita perlu menyatukan atau menggabungkan sebuah kolom atau baris untuk membentuk suatu susunan data yang sesuai, teratur dan rapih.

Waktu kita melakukan pengisan data pada tabel, kadang data yang harus diisi terdiri dari beberapa baris dalam beberapa kolom dengan 1 judul. Untuk kolom judul yang membawahi beberapa baris dan kolom, kita harus melakukan penggabungan 2 kolom atau lebih untuk membawahi baris-baris tersebut, sebagai ilustrasi seperti tergambar pada tabel dibawah ini :

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

dalam tabel tersebut menggambarkan 1 judul kolom (Perhatikan Gabungan Kolom) membawahi 2 baris kolom pertama dan 2 baris kolom kedua, untuk membuat itu kita perlu menambahkan keterangan perintah tambahan pada kode kolom <td> pada kolom data berisi tulisan gabungan kolom dengan perintah colspan, seperti terlihat penggunaannya pada kode tabel dibawah ini :

<table border="5" 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>

colspan adalah perintah untuk menggabungan beberapa kolom menjadi 1, seperti dalam kode diatas yaitu kode <td colspan="2"> menggambarkan perintah untuk menggabungkan 2 kolom, jika ingin menggabung 3 atau 4 kolom, kalian bisa mengubah angka 2 didepan kode colspan dengan jumlah kolom yang akan digabungkan.

Setelah mengatahui cara menggabungkan kolom menjadi satu, bagaimana dengan menggabungkan 2 atau beberapa baris menjadi satu, caranya sama dengan menggabungkan kolom menjadi satu, hanya kode keterangan perintah yang dipakai adalah rowspan, seperti tergambar pada deretan kode tabel dibawah ini :

<table border="5" 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>

dan hasilnya seperti ini :

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

Dari kedua contoh penggabungan kolom dan baris diatas, kita sudah bisa membuat tabel dengan data-data yang lebih teratur dan rapih.


Semoga bermanfaat,
referensi : klikbelajar

4 Diskusi untuk Menggabungkan Kolom Dan Baris Dalam Tabel

2 Mei 2012 07.59  

trims mas brow, ini yang q cari cari, cz q bikin blog buat program promosi, & tutor ni bermanfaat banget bagi kerapian blog q! skali lg trims

14 September 2012 18.50  

thanks teman, ane jadi nyelesaiin tugas design web ni :D
ane belum dikasih tau dosen sintaks gabungin baris, dan nemu di sini jd selesai :)
thanks

4 Desember 2012 18.55  

makasih tutorialnya pak.

salam.

23 Januari 2014 05.03  

Terimakasih sudah di share mas :).

Posting Komentar

supaya diskusi berjalan baik, gunakan tombol jawab untuk reply. penggunaan tombol jawab, jangan menghapus kode komentar pada kotak komentar, cukup mengetikan komentar disebelah atau dibawah kode komentar. Terima kasih.

rate this post
beri nilai posting ini
Terima kasih,

Template by Dicas Blogger | Modifikasi ulang oleh Mas Dalang

101011  ©Situseo Blog | Powered by Blogger | Back to Top