Cara Membuat Tabel HTML dengan tag
<table>, <tr> dan <td>
Untuk membuat tabel di HTML, kita membutuhkan setidaknya 3 tag, yaitu
tag <table>, tag <tr>,dan tag <td>:
Tag <table> digunakan untuk memulai tabel
Tag <tr> adalah singkatan dari table row, digunakan untuk membuat
baris dari tabel.
Tag <td> adalah singkatan dari table data, digunakan untuk
menginput data ke tabel.
PENGERTIAN TABEL
Tabel merupakan cara untuk menampilkan informasi dalam bentuk sel yang terdiri atas baris
dan kolom. Untuk menampilkan data dalam bentuk table dalam HTML, digunakan tag-tag <TABLE>,
<TR>, <TD>. <TABLE> .. </TABLE>.
Atribut :
align - Mendefinisikan perataan (align) tabel yaitu yaitu perataan kiri (left), tengah (center) atau
kanan (right).
bgcolor - Mendefinisikan warna latar belakang
border - Mendefinisikan ukuran garis tepi (border) dalam satuan pixels.
cellpadding - Mendefinisikan spasi
cellspacing - Mendefinisikan spasi antara dua cells dalam satuan pixels.
width Mendefinisikan ukuran tabel dalam pixels atau persentase.
contoh :
<TABLE align=center bgcolor=blue border=2 cellpadding=5 cellspacing=2
width=90%>
<TR> .. </TR>, untuk menentukan baris (table row)
Atribut :
align
Mendefinisikan
perataan
(align)
tabel
yaitu
(left), tengah (center) atau kanan (right)
bgcolor - Mendefinisikan warna latar belakang pada baris (rows)
yaitu
perataan
kiri
valign
Mendefinisikan
perataan
vertikal
pada
isi
dari
rows,
yaitu
sel
tabel
(table
perataan top, middle atau bottom.
Contoh :
<TR align=right bgcolor=red valign=top>
<TD>
</TD>,
untuk
menampilkan
data
pada
setiap
data)
Atribut :
align - Mendefinisikan perataan (align) tabel yaitu yaitu perataan kiri (left), tengah (center) atau
kanan (right).
background - Meletakkan image pada latar belakang tabel.
bgcolor - Mendefinisikan warna latar belakang
colspan -
height - Mendefinisikan tinggi cells dalam pixels
nowrap
rowspan
valign - Perataan vertikal yaitu perataan pada top, middle atau bottom.
width - Mendefinisikan ukuran tabel dalam pixels atau persentase.
Contoh :
<TD
align=right
background=back.gif
bgcolor=green
height=200 nowrap rowspan=2 valign=bottom width=300>
Struktur tag ini adalah sebagai berikut :
<TABLE>
<TR>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD></TD>
<TD></TD>
</TR>
</TABLE>
data baris 1 kolom 1
data baris 1 kolom 2
colspan=3
data baris 2 kolom 1
1.
data baris 2 kolom 2
Link Pada Dokumen HTML
Kelebihan utama dari dokumen HTML adalah kemampuannya untuk memberikan link dari
satu teks atau gambar menuju ke dokumen atau bagian lain dalam suatu dokumen. Browser web akan
menyorot (highlight) teks atau gambar yang diidentifikasi sebagai link dengan warna atau garis bawah
untuk menunjukan bahwa itu adalah hyperteks (sering diperpendek dengan hyperlink atau link).
Dokumen HTML menggunakan hyperlink (anchor) untuk menghubungkan kepada dokumen lain dalam
web dalam bentuk URL.
2.
Jenis-jenis Link :
Ada tiga jenis link dalam kategori link di HTML, beberapa diantaranya adalah :
Link Relatif
Link Absolut
Link dalam dokumen yang sama
Perbedaan ketiganya hanya pada letak dokumen yang menjadi linknya.
Link Relatif
Dibuat apabila anda membuat suatu link pada page Anda ke page lain pada halaman yang
sama, tidak memerlukan alamat internet yang lengkap. Jika dua page pada direktori yang sama, Anda
dapat menuliskan nama file HTML seperti berikut : <a herf=file_2. html >Contoh Link Relative</a>
Link Absolut
Jenis link seperti ini dibuat apabila Anda membuat link ke web lain yang berada pada halaman
lain di internet. Dalam hal ini Anda harus menuliskan alamat web tersebut secara lengkap, berikut ini
adalah contohnya : <a href=http : // www.google.com/Goolge.com,/a>
Link Dalam Dokumen Yang Sama
Link jenis ini dibuat untuk dokumen yang panjang sekali, sehingga apabila ditampilkan dalam
web browser akan mengharuskan kita melakukan scroll layar berulang ulang. Navigasi untuk
penulusuran dokumen dapat dimudahkan dengan membuat link antarbagian, dengan menandai setiap
bagian tersebut dengan memberinya nama. Sehingga pada beberapa tempat di dalam dokumen akan ada
bagian yang bernama, dan di bagian lainnya dapat diletakkan link untuk menuju bagian bagian
tersebut.
