≈ Halaman 49 ≈
BAB IX TABEL
Tabel digunakan untuk menyajikan data dalam bentuk kolom dan baris. Umumnya setiap kolom menunjukkan data yang sejenis, dan setiap baris yang terdiri atas kolom-kolom
menunjukkan kelompok data item data dalam satu kesatuan.
Gambar 9.1 : tabel
Elemen-elemen tabel :
Tag Keterangan
table...table
Mendefinisikan sebuah tebel dalam HTML. Jika atribut border dituliskan, maka browser akan menampilkan tabel dengan border.
th…th
Mendefinisikan sel header tabel, secara default teks dalam sel ini ditebalkan dan rata tengah.
tr…tr
Mendefinisikan sebuah baris tabel dalam tabel. Anda dapat mendefinisikan atribut untuk seluruh baris : alignleft,center,right
danatau valign top,middle,bottom
td…td
Mendefinisikan sebuah sel data tabel, secara default teks dalam sel ini akan ditampilkan rata kiri dan ditengah secara vertikal. Sel data tabel
dapat berisi atribut untuk mendefinisikan karakteristik dari sel dan isinya.
capion..caption
Untuk mendefinisikan judul tabel. Caption akan diletakkan rata tengah dengan huruf tebal bold.
kolom
baris
≈ Halaman 50 ≈
Atribut-atribut dalam tabel :
atribut Keterangan
Align={left center right} Mendefinisikan perataan sel secara horisontal
Valign={top middle bottom } Mendefinisikan perataan sel secara vertikal
Colspan=n Memperlebar sel sejumlah n kolom
Rowspan=n Memperbesar sel sejumlah n baris
Cellpadding = n Mendefinisikan jarak antara isi sel dengan border
Cellspacing=n Mendefinisikan jarakk antar sel
Contoh penggunaan tabel : HTML
HEAD TITLE Belajar Tabel TITLE
HEAD BODY
h4Daftar Pegawai STMIKh4 TABLE BORDER=1
TR ALIGN=CENTER BGCOLOR=PINK TDNoTD
TDNamaTD TDAlamatTD
TDTeleponTD TR
TR TD1TD
TDAsih WinantuTD TDBantul YogyakartaTD
TD0274-441170TD TR
TR TD2TD
TDAgus RiyantoTD TDSleman YogyakartaTD
TD0274-568912TD TR
TR TD3TD
TDSuhartiniTD TDKulon ProgoTD
TD0274-377982TD
≈ Halaman 51 ≈ TR
TABLE BODY
HTML
Tampilan dibrowser :
Gambar 9.2 : contoh tabel di browser
Contoh penggunaan tabel dengan rowspan dan colspan : html
head head
body table border=1 cellpadding=0 cellspacing=0
width=100 captionbDaftar Nilai Pemrograman Web 1bcaption
tr th width=33 rowspan=2 valign=middleNamath
th width=67 colspan=2 Nilaith tr
tr th width=33Tugasth
th width=34Praktikumth tr
tr td width=33Lutfiatd
td width=33 align=center80td
≈ Halaman 52 ≈ td width=34 align=center85td
tr tr
td width=33yulia td td width=33 align=center90td
td width=34 align=center93td tr
tr td width=33Ardiantd
td width=33 align=center100td td width=34 align=center98td
tr table
body html
≈ Halaman 53 ≈ Tampilan dibrowser :
Gambar 9.3 : tabel dengan elemen rowspan dan colspan
Memberikan background tabel :
Tabel dapat diberi background berupa gambar, dengan cara menambahkan atribut Background=nama gambar.ext
Contoh aplikasi penggunaan atribut background : html
head head
body table border=1 Background=isa.jpg width=50
height=50 captionbtabel dengan background gambarbcaption
tr td align=centerAtd
td align=centerBtd tr
tr
td align=centerCtd td align=centerDtd
tr
≈ Halaman 54 ≈ table
body html
Tampilan di browser :
Gambar 9.4 : tabel dengan background berupa gambar
≈ Halaman 55 ≈
BAB X FRAME
Kategori