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.