List dan Hyperlink
1.
PEMBAHASAN
PRAKTIKUM
Praktik
1
<!DOCTYPE
html>
<html>
<body>
Nama
Browser:
<ol>
<li>Mozila Firefox</li>
<li>Internet Explorer</li>
<li>Safari</li>
</ol>
<ul>
<li>Mozila Firefox</li>
<li>Internet Explorer</li>
<li>Safari</li>
</ul>
</body>
</html>
Kode HTML dibagian kiri atas akan membuat tampilan
seperti pada bagian kanan atas. Pada Kode HTML terdapat:
·
Tag <ol>...</ol>
yang menampilkan bagian list/ elemennya dengan angka, huruf,atau angka romawi.
Di dalam tag ini terdapat tiga elemen list sehingga aoutputnya memberikan 1, 2
dam 3 pada anggota listnya.
·
Tag <ul>...</ul>
yang menampilkan bagian listnya dengan bullet atau gambar. Pada bagian ini juga
terdapat tiga elemen list sehingga memberikan tiga buah bullet pada anggotanya.
[Penjelasan
lain ada di Listing]
Praktik
2
<!DOCTYPE html>
<html>
<body>
<a
href="modul_p31.html">Contoh list</a><br>
<a
href="www.akakom.ac.id">Kampus Akakom</a><br>
<a
href="foto/prajurit.jpg">Prajurut Keraton</a><br>
</body>
</html>
Pada
praktik 2 ini terdapat tag hyperliink yaitu <a href=””>...</a>
yang digunakan untuk menuju ke dokumen baru atau bagian lain yang dari dokumen
HTML tersebut atau menghubungkan satu dokumen dengan dokumen lain. Seperti pada
output dibawah ini jika jika salah satu dari link diklik maka akan menuju ke
halaman yang dijutukan.
[Penjelasan
lain ada di Listing]
Latihan
Pada
script HTML di listing latihan terdapat beberapa atribut dari Ordered List yang
diletakkan diawal tag <ol> untuk membuat item list dengan type karakter
yang ditentukan seperti <ol type="A">
maka elemen dari Ordered List tersebut akan menampilkan karakter A, B, C, ...
pada anggota listnya. Seeprti pada output dibawah ini:
2.
Tugas
a.
Jelaskan fungsi atribut title pada tag
<a>
ð Title adalah bagian dari link yang berfungsi memberikan
penjelasan yang lebih detil ataupun sama mengenai sebuah link. Title muncul
sebagai tooltip ketika mouse berada di atas link.
b.
Jelaskan arti dari link berikut:
·
<a
href=”http://www.coba.html#kedua”>Tugas 1</a>
ð Merupakan
absolute link dengan alamat yang dituju coba.html kemudian #kedua sebagai
bookmark kemudian teks yang akan ditapilkan pada output untuk diklik adalah
Tugas 1
·
<a href=”../data/foto/buku.jpg”>Tugas
1</a>
ð Merupakan
untuk mengambil gambar buku.jpg yang berada di direktori foto kemudian
direktori tersebut berada lagi dalam direktori data dan untuk dua titik (..)
sebagai pengarahan direktori sistem.
c.
Cari contoh web yang
ada anchor linknya (screenshot bagian anchornya)
d.
Bagaimana cara supaya link bisa new tab
(cara pembuatnya)
ð Untuk
membuat new tab pada suatu link yang diklik maka ditambahkan atribut
target=”_blank” sehingga jika diklik maka link tersebut akan langsung membuka
di tab baru contoh:
No comments:
Post a Comment