A. Pengertian HTML (Hyper Text Mark-up Language)
HTML adalah sebuah bahasa pemrograman yang digunakan untuk
membuat sebuah halaman Web. Untuk menulis kode HTML digunakan editor teks
seperti NotePad atau FrontPage. Contoh kode HTML:
<HTML>
<HEAD>
<TITLE>Latihan
Pertama<TITLE>
</HEAD>
<BODY>
Selamat Belajar HTML
</BODY>
</HTML>
1. Pasangan tag <HTML> dan </HTML> menandakan
bahwa kode yang terdapat didalamnya adalah
kode
HTML sehingga browser akan menerjemahkan sebagai dokumen HTML.
2. Bagian yang terdapat dalam <HTML> dan </HTML>
umumnya terbagi atas:
a.
kepala, ditandai dengan pasangan tag <HEAD> dan </HEAD>
b.
badan, ditandai dengan pasangan tag <BODY> dan </BODY>
3. Pada bagian kepala, bisa ditentukan judul dokumen HTML.
Judul ini ditulis dalam pasangan tag <TITLE> dan </TITLE>. Pada
contoh diatas, judul dokumen HTML adalah Latihan Pertama. Judul ini diletakan
dibagian atas jendela browser.
B. Cara Menuliskan Tag
Nama tag ditulis didalam tanda <dan>. Antara nama tag
dan tanda < ditulis tanpa spasi sama sekali. Nama tag boleh ditulis dengan
huruf kecil, huruf kapital, ataupun kombinasi antara huruf kecil dan huruf
kapital. Dengan kata lain:
<HTML>
<html>
<Html>
Dianggap sama. Namun umumnya nama
tag ditulis dengan huruf kecil saja atau huruf kapital saja.
C. Atribut dalam Tag
Beberapa tag mengandung atribut
didalamnya. Contoh:
< P
ALIGN=”CENTER”>
Pada contoh ini, P adalah nama tag sedangkan ALIGN adalah
nama atribut. Pada umumnya, atribut melibatkan nilai. Pada contoh diatas,
“CENTER” adalah nilai untuk atribut ALIGN.
D. Komentar
Komentar adalah bagian dari kode HTML yang diabaikan oleh
browser. Kegunaan komentar dalam kode HTML adalah sebagai keterangan. Sebuah
komentar diawali dengan <!—dan diakhiri dengan-->. Contoh:
<!—File
komentar.htm
Dibuat pada tanggal 4
Agustus 2002-->
<HTML>
<HEAD>
<TITLE>Komentar<TITLE>
</HEAD>
<BODY>
<!—Ini juga
komentar-->
Selamat belajar HTML
</BODY>
</HTML>
E. Tag <BR>
Fungsi tag <BR> adalah untuk membuat baris baru atau
berpindah baris. Contoh:
<HTML>
<HEAD>
<TITLE>Tag
BR</TITLE>
</HEAD>
<BODY>
Selamat belajar
HTML<BR>
Semoga sukses!
</BODY>
</HTML>
F. Tag <P>
Tag <P> digunakan untuk membuat paragraf. Contoh:
<HT,L>
<HEAD>
<TITLE>Contoh
Paragraf</TITLE>
</HEAD>
Pesona Tanaman
Hias<P>
Keindahan Tanaman
Hias<BR>
Membawa suatu pesona
tersendiri<BR>
Warna-warni
bunga<BR>
Aneka rupa corak
daun<BR>
Membuat orang dengan
senang hati mengoleksinya
</BODY>
</HTML>
Didalam tag <P> bisa disertakan atribut ALIGN yang
berguna untuk mengatur peletakan teks didalam masing-masing baris. Salah satu
nilai yang dapat diberikan pada ALIGN adalah CENTER yang menempatkan teks
berada ditengah-tengah layar pada baris yang bersangkutan. Selain CENTER, nilai
lain yang dapat diisikan pada ALIGN yaitu:
a. LEFT, mengatur teks rata kiri terhadap halaman
b. RIGHT, mengatur teks rata kanan terhadap halaman
c. JUSTIFY, mengatur teks rata kiri dan rata kanan. Efeknya
terlihat untuk teks yang sangat panjang. Contoh:
<HTML>
<HEAD>
<TITLE>Contoh
tag P dengan ALIGN</TITLE>
</HEAD>
<BODY>
PUISIKU:
<P
ALIGN=”CENTER”>
Matahari pun mulai
terbangun dari mimpi <BR>
Menyemburatkan
sinarnya yang hangat<BR>
Burung-burung
berkicau riang<BR>
Mengucapkan selamat
pagi<BR>
</P>
Yogyakarta, 2002
</BODY>
</HTML>
G. Tag Judul
HTML menyediakan 6 buah tag yang digunakan untuk mengatur
ukuran teks yang dijadikan sebagai judul dalam badan dokumen. Tag-tag judul ini
berupa:
a. <H1>....</H1>
b. <H2>....</H2>
c. <H3>....</H3>
d. <H4>....</H4>
e. <H5>....</H5>
f. <H6>....</H6>
Contoh:
<HTML>
<HEAD>
<TITLE>Tag
H1-H6</TITLE>
</HEAD>
<BODY>
<H1>Tag
H1</H1>
<H2>Tag
H1</H2>
<H3>Tag
H1</H3>
<H4>Tag
H1</H4>
<H5>Tag
H1</H5>
<H6>Tag
H1</H6>
</BODY>
</HTML>
Seperti halnya pada tag <P>, tag judul atau heading
ini juga memiliki atribut ALIGN. Nilai yang dapat diberikan pada ALIGN adalah:
a. LEFT (default), mengatur teks rata kiri terhadap halaman
b. RIGHT, mengatur teks rata kanan terhadap halaman
c. CENTER, menempatkan judul ditengah-tengah layar pada
baris yang bersnagkutan
d. JUSTIFY, mengatur teks rata kiri dan rata kanan. Efeknya
terlihat untuk teks yang sangat panjang. Contoh:
<HTML>
<HEAD>
<TITLE>Atribut
ALIGN</TITLE>
</HEAD>
<BODY>
<H1>Pesona
Tanaman Hias</H1>
<H1 ALIGN=”LEFT”>Pesona
Tanaman Hias</H1>
<H1
ALIGN=”RIGHT”>Pesona Tanaman Hias</H1>
<H1
ALIGN=”CENTER”>Pesona Tanaman Hias</H1>
</BODY>
</HTML>
H. Tag <HR>
Untuk mempercantik halaman seringkali pembuat dokumen Web
menambahkan garis horisontal. Garis ini sebenarnya dapat dibuat dengan mudah,
yakni dengan menyertakan tag <HR>. Contoh:
<HTML>
<HEAD>
<TITLE>Tag
HR</TITLE>
</HEAD>
<BODY>
<H2>Aneka
Tanaman Hias</H2>
<HR>
Aglaonema
atau Sri rejeki
<HR>
Begonia
<HR>
Bromelia
<HR>
Dll
<HR>
</BODY>
</HTML>
Daftar
atribut tag <HR>
Atribut
|
Keterangan
|
Size
|
Menentukan ketebalan garis
|
Width
|
Menentukan lebar garis
|
Align
|
Menentukan peletakan teks
dalam baris
|
Noshade
|
Mengatur agar garis tidak
disertai bayangan
|
Contoh
pengunaan atribut SIZE:
<HTML>
<HEAD>
<TITLE>Atribut
SIZE pada tag HR</TITLE>
</HEAD>
<BODY>
<H1>KEBUN
PESONA</H1>
<HR
SIZE="10">
Jl.
Solo km 14<BR>
Yogyakarta<BR>
Indonesia<BR>
</BODY>
</HTML>
Contoh
penggunaan atribut NOSHADE:
<HTML>
<HEAD>
<TITLE>Atribut
NOSHADE pada tag HR</TITLE>
</HEAD>
<BODY>
<H1>KEBUN
PESONA</H1>
<HR
SIZE=”10”NOSHADE>
Jl.
Solo Km 14<BR>
Yogyakarta<BR>
Indonesia<BR>
</BODY>
</HTML>
0 komentar:
Posting Komentar