Belajar Pemrograman Bersama Portal Coding

Belajar berbagai pemrograman secara gratis dan praktis agar cepat mahir.

Mulai Belajar

Mengenal Link Didalam HTML

Tanggal Upload : 2020-03-13 17:46:27

Diupload Oleh : Erji Ridho Lubis


# html # html dan css

mengenal link didalam html

 

Mengenal Link Didalam HTML

Setelah mengetahui bagaimana membuat heading atau judul paragraf didalam dokumen html, maka selanjutnya kita akan membahasi mengenai link didalam html. 

Simak pembahasan berikut ini.

Link atau tautan adalah sebuah tag / elemen html yang berfungsi menghubungkan suatu halaman web ke halaman web yang lain. Link atau tautan sering juga disebut dengan hyperlink. 

Ciri-ciri dari link pada dokumen html adalah jika kursor diarahkan pada text yang berisi link maka kursor akan berubah iconnya menjadi tangan kecil yang menunjuk.

Ada 2 tipe dari link, yaitu :

  1. Link internal : yaitu link yang menuju kehalaman pada website itu sendiri.
  2. Link eksternal : yaitu link yang menuju kehalaman website lain.

 

Link tidak hanya berupa teks, bisa juga berupa gambar atau icon, ataupun elemen html lainnya.

 

Tag link pada html

Untuk membuat sebuah link pada dokumen html, kita dapat menggunakan tag <a></a> seperti yang sudah kita ketahui pada artikel sebelumnya mengenai tag-tag html dan fungsinya.

struktur dasar tag <a></a> adalah seperti ini.

<a href="url">link text</a>

Adapun contoh struktur untuk membuatnya didalam dokumen html adalah sebagai berikut.

 


  <html>
    <head>
      <title>Belajar membuat link didalam HTML</title>
    </head>
    <body>
    <h2>Untuk Link Eksternal</h2>
      <p>Ini adalah paragraf pertama, <a href="https://www.portal-coding.blogspot.com">klik disini untuk menuju kehalaman lain.</a></p>
    <br>  
    <h2>Untuk Link Internal</h2>
      <p>Ini adalah paragraf kedua, <a href="/post/belajar-html-dasar-sampai-mahir">klik disini untuk menuju kehalaman lain.</a></p>
    </body>
  </html>

 

Membuat link dengan menggunakan gambar


  <html>
    <head>
      <title>Belajar membuat link didalam HTML</title>
    </head>
    <body>
    <h2>Link Menggunakan gambar</h2>
      <a href="https://www.portalcoding.net">
          <img src="https://www.portalcoding.net/upload/content/mengenal-link-dalam-html/mengenal-link-dalam-html0-5e1b01ab8d4d8.jpg" alt="mengenal link didalam html">
      </a>
    </body>
  </html>

 

Atribut target pada link

Pada link di html, ada sebuah atribut target yang fungsinya uuntuk menentukan tempat membuka dokumen yang ditautkan

 

<a href="link" target="_self">link target self</a>

untuk membuka link di halaman link itu berada. ini merupakan setelan dasar link jika pada elemen link tidak diberi atribut target.

 

 

<a href="link" target="_blank">link target blank</a>

untuk membuka link di tab baru

 

 

<a href="link" target="_parent">link target parent</a>

untuk membuka link di frame yang satu tingkat di atas frame link tersebut berada.

 

 

<a href="link" target="_top">link target top</a>

untuk membuka link di halaman paling atas (paling luar).

 

 

<a href="link" target="framename">penamaan link</a>

untuk membuka link di frame yg kita pilih

 

 

Selanjutnya :

=> Membuat paragraf didalam HTML

 

Advertisement



Tentang Portal Coding

Tentang Portal Coding

Portal Coding adalah situs web yang membahas mengenai berbagai macam bahasa pemrograman baik versi web, desktop maupun mobile secara lengkap.

Portal Coding On Youtube

Ayo subscribe channel Portal Coding di Youtube. Dichannel ini kami menyediakan berbagai tutorial dalam bentuk video. Agar kita lebih mudah belajar pemrograman. Klik disini untuk subscribe.

Subscribe