LINK : Kelebihan utama dari HTML adalah
kemampuannya untuk memberikan link dari satu teks/gambar menuju dokumen
lain atau bagian lain dalam suatu dokumen. Ada empat jenis link :
1. Link
relative
Membuat link dari satu page ke page yang lain
pada komputer yang sama.
<a
href="nama file"> ….. </a>
Contoh :
<a href=”perpustakaan.html”>perpustakaan</a>
2. Link
absolute
Membuat link ke page web lain yang berada pada web
site lain di Internet.
<a
href="alamat web site"> …. </a>
Contoh ;
<a href="http://www.facebook.com">Facebook</a>
3. Link
dalam dokumen yang sama :
Link jenis ini
dibuat apabila dokumen panjang, sehingga apabila ditampilkan dalam bowser
web mengharuskan untuk melakukan scroll layer berulang-ulang.
Navigasi untuk memudahkan penelusuran dokumen dengan membuat link antar
bagian dengan memberinya nama.
<a
href="#nama bagian"> ……. </a>
Contoh :
<a href=”#pengenalan”>Pengenalan</a>
…………
…………
<a name=”pengenalan”>
……..
</a>
4. Link Email
Link pada suatu pesan email.
<a href="mailto:alamat
email">…..</a>
Contoh :
<a href=”mailto:endar_nirmala@yahoo.com”>kirim
email</a>
List Item (Li)
List dengan nomor (ordered list)
Type : I, i, a, A
<ol
type=" ... ">
<li>
... </li>
<li>
... </li> dst
</ol>
List tanpa
nomor menggunakan bullet (unordered list)
Type :
square, circle, disc
<ul type=" ... ">
<li> ... </li>
<li> ... </li> dst
</ul>
Menu List (Daftar Menu)
Merupakan daftar item
yang pendek dan tidak disertai dengan nomor ataupun penanda item. Menu list menggunakan
tag awal <MENU> dan tag akhir </MENU>, dengan setiap
item di dalamnya menggunakan <LI>
<menu>
<li> …….. </li>
<li> …….. </li>
</menu>
Definition List <DL>
<dl> <dt> ... </dt>
<dd> ..................... </dd>
<dt> ... </dt>
<dd> ...................... </dd>
</dl>
Image (IMG)
Jenis format image yang sering digunakan adalah :
GIF (Graphical Interchange Format) .GIF
JPEG (Joint Photographic Expert Image) .JPG
PNG (Portable Network Graphics) .PNG
<img
src=" ... " width= "..." height =" ..." Alt=" … " align=" …">
src : nama file gambar
Height : tinggi gambar
Width : lebar gambar
Align : mengatur letak image
terhadap teks (top| bottom| middle| left| right|center)
Alt : menampilkan teks pada saat
image ditunjuk dengan pointer
Contoh :
<html>
<head><title>penggunaan
image</title></head>
<body>
<p><img src="naruto.jpg" height="100"
width="100">
Default
alignment at the bottom</p>
<p><img src="naruto.jpg" height="100"
width="100" align="top"> Aligned at Top</p>
<p><img src="naruto.jpg" height="100"
width="100" align="middle"> Aligned at Middle</p>
</body>
</html>
Image Map
Image
map merupakan
suatu area pada image yang bisa diberi hyperlink area dan biasanya
disebut ”hot spots”. Koordinat dari hot spot ditentukan
menggunakan bidang geometry seperti rectangle, polygon dan lainya
Contoh :
<html>
<head><title>Membuat Hotspot</title> </head>
<body> <img src="tkj.jpg" width="450" height="250" border=0
usemap="#Map">
<map name="Map">
<area shape="rect"
coords="0,0,200,100"
href="file1.htm" Alt="kotak
link">
<area shape="circle" coords="350,45,40"
href="file2.htm"
Alt="ingkaran link">
<area shape="poly"
coords="55,100,95,90,105,130,
120,120,175,190,70,195,50,165,60,140"
href="#">
</map>
<body>
</html>Sumber: Guru TKJ
Post a Comment