ساخت لینک به نقاط مختلف یک صفحه

html-3-6-1

تصور کنید که یک صفحه بلند داشته باشید و در این صفحه بخواهید که بیننده با یک کلیک از نقطه معینی به بالای صفحه باز گردد و یا بخواهید صفحه را به چندین قسمت تقسیم نمایید و در قسمت بالایی صفحه فهرستی وجود داشته باشد که بازدید کننده با کلیک روی عنوان آن به قسمت های مختلف صفحه هدایت گردد.

برای این منظور میتوانید از لینک های نام گذاری شده که در قسمت های مشخصی از صفحه قرار دارند استفاده نمایید.

برای این منظور ابتدا در قسمت body  سند یک تگ <a> قرار میدهیم و از شناسه ای بنام name  به منظور نام گذاری آن استفاده مینماییم  و برای آن مقدار مناسبی قرار میدهیم.حال برای اینکه منظورمان مفهومی تر باشد صفحه را پر از متن میکنیم.سپس به جایی میرویم که میخواهیم لینکی از صفحه در آنجا قرار داشته باشد.در این جا نیز یک تگ <a> ایجاد کرده و متن مورد نظر را در آن مینویسیم.

حال به مثال زیر توجه نمایید:

<html>

<head>

<title> Learning html</title>

</head>

<body>

<a name=”top”></a>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<h2>This is a Test</h2></br>

<a href=”#top”>Back to top</a>

</body>

</html>

دقت نمایید که علامت # در لینک نشان دهنده این میباشد که لینک مورد نظر در همان صفحه میباشد.

حال سند را با نام test  ذخیره کرده و نتیجه را مشاهده نمایید.

همانطور که ملاحظه میکنید در انتهای متن لینکی با عنوان Back to top وجود دارد که با کلیک بر روی آن به ابتدای صفحه منتقل میشویم.

با استفاده از این کار نه تنها میتوانید کاری کنید که بازدیدکننده به قسمت های مختلف صفحه برود بلکه میتوانید از این روش برای قرار دادن لینک در دیگر صفحات نیز استفاده کنید و بازدید کننده را به یک قسمت  مشخص از صفحه ی دیگری هدایت نمایید.

نکته مهم در اینکار اینست که در صفحه مقصد باید لینک های نام گذاری وجود داشته باشند و از این نام گذاری در لینکی که در صفحه مبدا قرار دارد استفاده شود.

برای مثال میخواهیم سند جدیدی ایجاد کرده  و در آن لینکی را قرار دهیم که با کلیک بر روی آن به قسمت صفحه  تمرین قبل منتقل شویم.

برای اینکار به این صورت عمل میکنیم.در قسمت body این سند یک تگ <a> قرار داده و مقدار شناسه href آنرا برابر نام صفحه مورد نظر با پسوند htm  قرار میدهیم.بعد ازنام صفحه علامت # را قرار داده و در کنار آن آدرس صفحه را که در اینجا test میباشد مینویسیم.

<html>

<head>

<title> Learning html</title>

</head>

<body>

<a href="test.htm#test">Page one(Test)</a></body>

</html>

حال سند را ذخیره کرده و نتیجه را مشاهده مینماییم.

میبینید که با کلیک بر روی لینک ساخته شده به قسمت test  در صفحه مورد نظر منتقل میشویم.

More from my site