Attribute Name dan id sebagai Link

Hyperlink (Link) tak hanya dapat menghubungkan sebuah dokumen html di halaman web/blog dengan dokumen html yang lain pada halaman berbeda (baik di blog/web yang sama atau berbeda), namun bisa juga digunakan untuk menghubungkan antar dokumen dalam satu halaman yang sama. Menggunakan link untuk tujuan seperti ini dapat dimanfaatkan untuk berpindah dari satu bagian ke bagian yang lain (misalnya perpindahan antar paragraf, top - bagian teratas halaman, atau ke bottom - bagian terbawah halaman).

Attribute Name

<a name="go-bottom"></a>
Kode di atas dapat diletakkan diujung terbawah halaman, kemudian pada posisi tertentu kita gunakan link seperti berikut:
<a href="#go-bottom">BOTTOM</a>
to-BOTTOM Kode di bawah ini dapat diletakkan diujung teratas halaman:
<a name="back-top"></a>
Pada posisi tertentu kita gunakan link seperti berikut:
<a href="#back-top">BACK to TOP</a>

Attribute name sbg link antar paragraf

ke Attribute id sbg link
<h3><a name="paragraf-1">PARAGRAF-1</a></h3>
<p>konten paragraf-1
<a href="#paragraf-5">ke-paragraf-5</a></p>
<h3><a name="paragraf-2">PARAGRAF-2</a></h3>
<p>konten paragraf-2</p>
<h3><a name="paragraf-3">PARAGRAF-3</a></h3>
<p>konten paragraf-3</p>
<h3><a name="paragraf-4">PARAGRAF-4</a></h3>
<p>konten paragraf-4</p>
<h3><a name="paragraf-5">PARAGRAF-5</a></h3>
<p>konten paragraf-5</p>
<h3><a name="paragraf-6">PARAGRAF-6</a></h3>
<p>konten paragraf-6
<a href="#paragraf-2">ke-paragraf-2</a></p>
<h3><a name="paragraf-7">PARAGRAF-7</a></h3>
<p>konten paragraf-7</p>

Attribute id

<div id="go-bottom"></div>
Kode di atas dapat diletakkan diujung terbawah halaman, kemudian pada posisi tertentu kita gunakan link seperti berikut:
<a href="#go-bottom">BOTTOM</a>
<span id="back-top"></span>
Kode di atas dapat diletakkan diujung teratas halaman, kemudian pada posisi tertentu kita gunakan link seperti berikut:
<a href="#back-top">BACK to TOP</a>

Attribute id sbg link antar paragraf

<h3 id="paragraf-1">PARAGRAF-1</h3>
<p>konten paragraf-1
<a href="#paragraf-7">ke-paragraf-7</a></p>
<h3 id="paragraf-2">PARAGRAF-2</h3>
<p>konten paragraf-2</p>
<h3 id="paragraf-3">PARAGRAF-3</h3>
<p>konten paragraf-3</p>
<h3 id="paragraf-4">PARAGRAF-4</h3>
<p>konten paragraf-4</p>
<h3 id="paragraf-5">PARAGRAF-5</h3>
<p>konten paragraf-5
<a href="#paragraf-2">ke-paragraf-2</a></p>
<h3 id="paragraf-6">PARAGRAF-6</h3>
<p>konten paragraf-6</p>
<h3 id="paragraf-7">PARAGRAF-7</h3>
<p>konten paragraf-7</p>
Back to TOP

Tidak ada komentar:

Posting Komentar

My ProfileC l o s e

FollowerC l o s e