Membuat tabel dengan HTML
Melanjutkan artikel sebelumnya pada Struktur Dasar HTML kali ini AvibBLOG'S akan berbagi sedikit ilmu mengenai tips-tips dalam penggunaan dalam HTML. kali ini akan memberikan contohnya dalam membuat tabel didalam HTML. Sebenarnya tidak terlalu sulit cara membuat table dalam HTML. Langsung saja mungkin tak usah di jelaskan apa itu "TABEL"
Untuk menampilkan dalam bentuk tabel pada HTML, digunakan tag
<table> … </table>.
Elemen tabel berisi properti <tr>…</tr> untuk menentukan baris (table row) yang didalamnya terdapat properti <td>…</td> untuk menampilkan data pada setiap sel tabel (table data) Struktur lengkap dari elemen tabel adalah sebagai berikut:
-Atribut Elemen Table
width = panjang ( lebar tabel, pixel atau persen )
height = panjang ( tinggi tabel, pixel atau persen)
border = pixel ( tebal garis tepi )
cellspacing = pixel ( spasi antar sel )
cellpadding = pixel ( spasi di dalam )
align = [ left | center | right ] ( perataan tabel)
bgcolor = warna ( warna latar belakang tabel)
-Atribut Table Row
align = [ left | center | right ] (perataan sebaris sel secara horizontal)
valign = [ top | middle | bottom ] (perataan sebaris sel secara vertical)
bgcolor = warna ( warna latar belakang baris)
-Atribut Table Data
rowspan = angka (baris yang di span oleh sel)
colspan = angka (kolom yang di span oleh sel)
align = [ left | center | right ] ( perataan horizontal)
valign = [top | middle | bottom ] (perataan vertical)
width = pixel ( lebar sel, pixel atau persen )
height = panjang ( tinggi sel, pixel atau persen)
bgcolor = warna ( warna latar belakang sel)
<table> … </table>.
Elemen tabel berisi properti <tr>…</tr> untuk menentukan baris (table row) yang didalamnya terdapat properti <td>…</td> untuk menampilkan data pada setiap sel tabel (table data) Struktur lengkap dari elemen tabel adalah sebagai berikut:
-Atribut Elemen Table
width = panjang ( lebar tabel, pixel atau persen )
height = panjang ( tinggi tabel, pixel atau persen)
border = pixel ( tebal garis tepi )
cellspacing = pixel ( spasi antar sel )
cellpadding = pixel ( spasi di dalam )
align = [ left | center | right ] ( perataan tabel)
bgcolor = warna ( warna latar belakang tabel)
-Atribut Table Row
align = [ left | center | right ] (perataan sebaris sel secara horizontal)
valign = [ top | middle | bottom ] (perataan sebaris sel secara vertical)
bgcolor = warna ( warna latar belakang baris)
-Atribut Table Data
rowspan = angka (baris yang di span oleh sel)
colspan = angka (kolom yang di span oleh sel)
align = [ left | center | right ] ( perataan horizontal)
valign = [top | middle | bottom ] (perataan vertical)
width = pixel ( lebar sel, pixel atau persen )
height = panjang ( tinggi sel, pixel atau persen)
bgcolor = warna ( warna latar belakang sel)
Contoh pembuatan tabel dan tatak letaknya
Code:
atas kiri | atas tengah | atas kanan |
tengah kiri | tengah tengah | tengah kanan |
bawah kiri | bawah tengah | kiri bawah |
hmm.. di w3school juga ada.. :)
ReplyDeletevalign itu yang saya rasa cukup penting. :)
Semuanya juga penting om, saling ketergantungan soalnya :)
ReplyDeletesedikit bingung kalau buat tabel yang pakai merger tuh gan
ReplyDeletekalau di WP bisa buat di word, terus copy paste beres
he. he.. tapi di blogspot sepertinya agak error dech
Citro Mduro : ane aja di blogpot aja msih bngung juga gan...apalagi di WP hhe
ReplyDelete