Membuat tabel html colspan rowspan
Jika Anda bingung bagaimana tata letak tabel bekerja, mereka pada dasarnya mulai dari x = 0, y = 0 dan bekerja dengan cara mereka. Mari kita jelaskan dengan grafik, karena mereka sangat menyenangkan! Show Saat Anda memulai tabel, Anda membuat kotak. Baris dan sel pertama Anda akan berada di sudut kiri atas. Anggap saja seperti pointer array, bergerak ke kanan dengan setiap nilai x yang bertambah, dan bergerak ke bawah dengan setiap nilai y yang bertambah. Untuk baris pertama Anda, Anda hanya mendefinisikan dua sel. Satu bentang 2 baris ke bawah dan satu bentang 4 kolom. Jadi ketika Anda mencapai akhir baris pertama Anda, itu terlihat seperti ini:
Sekarang setelah baris telah berakhir, "array pointer" melompat ke baris berikutnya. Karena x posisi 0 sudah diambil oleh sel sebelumnya, x melompat ke posisi 1 untuk mulai mengisi sel. * Lihat catatan tentang perbedaan antara rowspans. Baris ini memiliki empat sel di dalamnya yang semuanya blok 1x1, mengisi lebar yang sama dari baris di atasnya.
Baris berikutnya adalah semua sel 1x1. Tetapi, misalnya, bagaimana jika Anda menambahkan sel ekstra? Yah, itu hanya akan keluar dari Edge ke kanan.
* Tapi bagaimana jika kita bukannya (daripada menambahkan sel ekstra) membuat semua sel ini memiliki rowspan 2? Hal yang perlu Anda pertimbangkan di sini adalah bahwa meskipun Anda tidak akan menambahkan lagi sel di baris berikutnya, baris tersebut masih harus ada (meskipun itu baris kosong). Jika Anda memang mencoba untuk menambahkan sel baru di baris segera setelah itu, Anda akan melihat bahwa itu akan mulai menambahkan mereka ke akhir baris bawah.
Nikmati dunia indah menciptakan tabel! HTML atribut rowspan merupakan atribut pada element HTML tabel yang digunakan untuk menggabungkan dua buah atau lebih kelompok baris pada data tabel menjadi satu. Row (baris) merupakan deretan sel pada tabel yang mempunyai arah membujur ke kanan dan kiri atau sebaliknya (horizontal). Penggabungan ini berguna untuk menggabungkan (merger) suatu tabel header atau tabel data saat terdapat data tabel yang mempunyai kesamaan kriteria. Penggabungan ini biasanya dilakukan pada bagian judul yang mempunyai baris anakkan disampingnya. Hasil penggabungan suatu tabel header ataupun tabel data akan mendapatkan sebuah tabel sel baru dengan ukuran tinggi yang sama dengan jumlah ukuran tinggi baris yang berhasil digabungkan. Penggabungkan beberapa buah baris dapat dilakukan dengan menuliskan nilai atribut rowspan="jumlah baris". Rowspan (penggabungan baris) pada tabel : Susunan tabel pada HTML : Penulisan Syntax: rowspan="jumlah baris">Konten | rowspan="jumlah baris">Konten | Berikut ini contoh penggunaan atribut rowspan untuk menggabungkan beberapa baris pada suatu tabel : 1
Jika dijalankan pada browser akan menghasilkan tampilan sebagai berikut : Jika diperhatikan pada hasil di atas, pada kolom kategori terdapat 3 buah baris sel yang sudah dirangkap/dimerger menjadi satu. Sebelum dilakukan penggabungan, terdapat 3 buah sel kemudian menghasilkan 1 buah sel karena proses merger dengan memberikan atribut rowspan="3". Sel hasil merger tersebut digunakan sebagai judul pada kategori untuk Murid Laki-laki dan Murid Perempuan. Browser Pendukung : Catatan : Sebelum adanya penataan gaya dengan CSS, tagBài Viết Liên QuanCó thể bạn quan tâmXem NhiềuChúng tôiTrợ giúp |