COLSPAN DAN ROWSPAN di Table HTML

Rowspan adalah html attribute yang digunakan untuk memperlebar atau menggabungkan beberapa kolom atau row menjadi satu, sehingga satu unit kolom atau row ini menjadi lebih lebar. Colspan adalah kependekan dari “column span” yang bisa mengartikan sebagai “berapa kotak kesamping” sedangkan rowspan mengartikan “berapa kotak kebawah”.

Untuk membuat table colspan dan rowspan, diperlukan table atribut data tersendiri. Table atribut data yang digunakan adalah sebagai berikut. 
1.   Rowspan = angka (banyaknya baris yang di-span oleh sel).

                berikut ini contoh menggabungkan 2 baris dalam menggunakan  
            atribut Rowspan.

              

 

                Maka hasilnya akan seberti berikut ini.

               

2.   Colspan = angka (banyaknya kolom yang di-span oleh sel).

                Berikut ini contoh menggabungkan 2 baris dalam menggunakan  
            atribut Colspan.

               

                Maka hasilnya akan seberti berikut ini.

               

        

        Selanjutnya mari kita buat satu lagi kolom dalam tabel dengan menggunakan atribut rowspan.

             1.      Ketikkan Script berikut ke dalam text editor anda

               2.      Kemudian disimpan (save) dengan ekstention.html 

             3.      Langkah selanjutnya jalankan script dengan 
                      menggunakan web browser (internet 

                      eksplorer, google chrome dll), maka akan didapatkan 
                      hasil seperti berikut ini.

Sekian Ilmu yang dapat saya berikan, kurang lebihnya mohon maaf. terima kasih

Format Tabel pada Halaman Web

  Membuat Anatomi Tabel Minimal

                                                                                                                                       1.        Pembuatan Tabel   

Tabel merupakan cara untuk menampilkan informasi dalam bentuk sel yang terdiri atas baris dan kolom. Untuk menampilkan data dalam bentuk tabel pada HTML, digunakan Tag <Table>. 

Elemen tabel berisi properti <tr> untuk menentukan baris ( table row ) yang didalamnya terdapat properti <td> untuk menampilkan data pada setiap sel table (tabel data).

Struktur elemen tabel adalah

<table>
 <tr>
 <td>data baris 1 kolom 1</td>
 <td>data baris 1 kolom 2</td>
</tr></table> 

Berikut ini adalah macam atribut elemen tabel.

Berikut ini adalah macam atribut table row.

Beirkut ini adalah macam atribut tabel data.

Contoh tabel yang terdiri atas 2 baris dan 2 kolom

<table border=”1”>

<tr>     

<td>Cell 1 – Baris 1 kolom 1</td>

<td>Cell 2 – Baris 1 kolom 2</td>

</tr>

<tr>

<td>Cell 3 – Baris 2 kolom 1</td>

<td>Cell 4 – Baris 2 kolom 2</td>

</tr>

</table>

maka hasinya akan seperti berikut ini.

22.           Mengatur Lebar dan Tinggi Tabel

Untuk mengatur lebar tabel, digunakan width atau dengan style CSS dengan properti width. Untuk lebar dan tinggi td, kita gunakan atribut style dengan properti width, height, dan align.

Berikut adalah contoh pemformatan tabel.

1. Ketikkan Script berikut ke dalam text editor anda
   
   
   
2. Kemudian disimpan (save) dengan ekstention.html
3. Langkah selanjutnya jalankan script dengan menggunakan web browser (internet eksplorer, google chrome dll), maka akan didapatkan hasil seperti berikut ini.
   

3.         Kesimpulan

 

sekian dari saya tentang penerapan Pemformatan Tabel pada Halaman Web yang bisa saya bagikan, semoga bisa bermanfaat untuk anda. Terima kasih