Beranda / html / Komputer / Pemrograman / Web

HTML Link - Membuat Bookmark | Tutorial HTML 16

Oleh Sopyan Posting Komentar
Assalamualaikum sobat, di artikel kali ini kami akan memberikan tutorial mengenai bookmark di HTML, bookmark merupakan salah satu bagian dari link HTML, dengan menggunakan bookmark kita bisa melompat ke bagian tertentu pada halaman web.

Cara Membuat Bookmark di HTML

Jika artikel atau halaman web sangat panjang, bookmark sangat penting dan berguna.

Untuk membuat bookmark, pertama- tama kita harus membuat bookmark terlebih dahulu, kemudian menambahkan link ke dalamnya.

Ketika link di klik, halaman akan berpindah ke tempat yang telah ditandai.

Untuk membuat bookmark, pertama kita gunakan atribut id.

<h2 id="B5">Bab 5</h2>

Selanjutnya, tambahkan link ke bookmark untuk melompat ke Bab 5 dari dalam halaman yang sama.

Contoh Program 1 : Membuat Bookmark HTML

<!DOCTYPE html>
<html>
<body>
  
  <p><a href="#B5">Lompat ke Bab 5</a></p>
  <p><a href="#B10">Lompat ke Bab 10</a></p>
  <p><a href="#B22">Lompat ke Bab 22</a></p>
  
  <h2>Bab 1</h2>
  <h2>Bab 2</h2>
  <h2>Bab 3</h2>
  <h2>Bab 4</h2>
  <h2 id="B5">Bab 5</h2>
  <h2>Bab 6</h2>
  <h2>Bab 7</h2>
  <h2>Bab 8</h2>
  <h2>Bab 9</h2>
  <h2 id="B10">Bab 10</h2>
  <h2>Bab 11</h2>
  <h2>Bab 12</h2>
  <h2>Bab 13</h2>
  <h2>Bab 14</h2>
  <h2>Bab 15</h2>
  <h2>Bab 16</h2>
  <h2>Bab 17</h2>
  <h2>Bab 18</h2>
  <h2>Bab 19</h2>
  <h2>Bab 20</h2>
  <h2>Bab 21</h2>
  <h2 id="B22">Bab 22</h2>
</body>
</html>

Hasil Program 1

Hasil Program 1 Bookmark HTML

Penjelasan Program 1

Contoh Program 1 Bookmark HTML
  • Di baris 5 kita membuat paragraf yang ditautkan ke Bab 5.
  • Di baris 6 kita membuat paragraf yang ditautkan ke Bab 10.
  • Di baris 7 kita membuat paragraf yang ditautkan ke Bab 22.
  • Di baris 9 sampai baris 30 kita membuat Heading.
  • Di baris 13, baris 18 dan baris 30 kita membuat bookmark untuk Bab 5, Bab 10 dan Bab 22.
Kita juga bisa menambahkan link ke bookmark yang ada di halaman HTML lain:
<a href="halaman_html2.html#B4">Lompat ke Bab 4</a>

Rangkuman Artikel Bookmark HTML

  • Atribut id (id="nilai") digunakan untuk membuat bookmark.
  • Atribut href (href="#nilai") digunakan untuk membuat link ke bookmark.

Tag Link HTML

Tag Deskripsi
<a> Digunakan untuk membuat hyperlink

Itulah tutorial mengenai cara membuat bookmark HTML, semoga artikel ini bermanfaat, sampai jumpa di tutorial selanjutnya.


Posting Komentar untuk "HTML Link - Membuat Bookmark | Tutorial HTML 16"