Cara Mudah Belajar Tag Hyperlink di HTML

Objectif: 

Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element- element untuk menghubungkan ke internal atau eksternal halaman web.

Materi:   
Element A

Baca juga : Cara Mudah Menyisipkan Attribut Warna pada CSS

Element [A]
Element A befungsi untuk menghubungkan ke internal ataupun eksternal halaman web. Element ini mempunyai attribute href, name, dan target. Attribute href berfungsi sebagai hypertext reference yang mempunyai nilai URI (uniform resource identifier) yang akan menghubungkan ke eksternal alaman web. Attribute name berfungsi untuk menghubungkan ke tempat tujuan dalam halaman web (anchor). Attribute target berfungsi untuk menampilkan halaman web pada suatu jendela frame atau jendela baru.
Sintaks:
<a href="uri" name="name" target="_blank"|"parent"|"_top"|"_self">
...........................
</a>


LATIHAN   
Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini dan menyimpannya dengan menggunakan extention ‘.html’ contoh : latihan.html.
Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser.


Baca juga :
Belajar Struktur dan kode HTML dasar. Untuk pemula
Belajar Element FORM pada HTML
Cara mudah belajar Tag Hyperlink di HTML
Belajar Tag dan Element Frameset sederhana pada HTML
Kumpulan Desain dan Script Frameset pada HTML

Latihan 1: Membuat link eksternal: 

Link:
1.    Yahoo.com
2.    Google.com
3.    Legidjahari.blogspot.com

Cara Mudah Belajar Tag Hyperlink di HTML

<html>
<head><title>Legi</title></head>
<body>
Link :
<ol>
<li><a href="http://www.yahoo.com">Yahoo</a></li>
<li><a href="http://www.google.com">Google</a></li>
<li><a href="http://legidjahari.blogspot.com">LD Computer</a></li>
</ol>
</body>
</html>

Latihan 2: Membuat link internal dan anchor
Link internal dan anchor adalah link yang menunjuk ketempat yang ada dalam dokument ini.

Cara Mudah Belajar Tag Hyperlink di HTML
  
<html>
<head><title>Legi</title></head>
<body>
Link internal dan anchor adalah link yang menunjuk ketempat yang ada dalam dokument ini.<br>
<a href="#akhir">kebagian akhir</a>   
<a name="pertama"></a>   
<p>Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini. Ini adalah teks bagian pertama dalam dokumen ini. Ini adalah teks bagian pertama dalam dokumen ini. Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini. </p>
 <p>Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini. Ini adalah teks bagian kedua dalam dokumen ini. Ini adalah teks bagian kedua dalam dokumen ini. Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.</p>
<p>Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini. Ini adalah teks bagian ketiga dalam dokumen ini. Ini adalah teks bagian ketiga dalam dokumen ini. Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.</p>
<p>Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini. Ini adalah teks bagian keempat dalam dokumen ini. Ini adalah teks bagian keempat dalam dokumen ini. Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.</p>   
<p>Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini. Ini adalah teks bagian kelima dalam dokumen ini. Ini adalah teks bagian kelima dalam dokumen ini. Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.</p>
<a name="akhir"></a>
<p>Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini. Ini adalah teks bagian keenam dalam dokumen ini. Ini adalah teks bagian keenam dalam dokumen ini. Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.</p>
<a href="#pertama">kebagian pertama</a>
</body>
</html>

0 komentar:

Post a Comment