Tutorial Tabel HTML Part 7: Cara Membuat Garis Antara Baris dan Kolom Tabel (atribut rules)

Pada tutorial kali ini kita akan membahas tentang atribut rules. Atribut ini dapat digunakan untuk membuat dan mengubah garis pembatas antar sel (baris dan kolom) di dalam tabel HTML.

Karena atribut ini sangat berkaitan dengan tampilan untuk memperindah tabel, disarankan menggunakan CSS sebagai ganti atribut rules ini jika anda telah memahami CSS.

Jika sebelumnya anda telah mempelajari pembahasan tentang atribut border untuk tabel, maka jika diperhatikan, web browser sebenarnya tidak hanya menampilkan border, namun juga garis pembatas di antara sel tersebut, seperti tampilan dibawah ini:

HTML menyediakan sebuah atribut yang dapat digunakan untuk mengontrol garis pembatas antara baris dan kolom ini, yakni atribut rules. Penulisan atribut rules di letakkan pada tag table. Atribut rules dapat berisi 1 diantara 4 nilai: rows, cols, all, atau none.

Sesuai dengan arti dari masing-masing nilai tersebut, jika kita menambahkan atribut rules=”cols” pada tabel, maka untuk setiap sel akan ditampilkan garis pembatas hanya diantara kolom. Sedangkan atribut rules=”rows” akan menampilkan garis pembatas hanya diantara baris.

Jika menginginkan garis tampil baik untuk kolom maupun untuk baris tabel, kita dapat menggunakan atribut rules=”all”. Sebaliknya jika tidak ingin menampilkan garis apapun diantara sel, bisa menggunakan atribut rules=”none”.

Berikut adalah contoh dari kode HTML yang menggunakan atribut rules, savelah sebagai tabelrules.html

Dari hasil kode HTML diatas, terlihat perbedaan untuk masing-masing nilai rules. Anda bisa menggabungkan berbagai atribut lainnya seperti border, cellspacing, dan lain-lain untuk menghasilkan tabel sesuai dengan keinginan.

Didalam tutorial belajar HTML berikutnya, kita akan membahas tentang cara mengatur dan mengubah lebar tabel HTML dengan menggunakan atribut width.