এইচটিএমএল <area> ট্যাগ

admin Sep 27, 2020 1984 0

এইচটিএমএল <area> ট্যাগ

সংজ্ঞা ও ব্যবহার

<area> ট্যাগ দ্বারা ইমেজ-ম্যাপ এর ভিতর একটি এরিয়াকে নির্দেশ করে (ইমেজ-ম্যাপ হলো একটি ইমেজ যেটিতে ক্লিকযোগ্য এরিয়া রয়েছে)।

<area> এলিমেন্ট সবসময় <map> এলিমেন্টের মধ্যে থাকে।

নোটঃ <img> ট্যাগের usemap এট্রিবিউট <map> এলিমেন্টের name এট্রিবিউট এর সঙ্গে যুক্ত করে। ফলে ইমেজ এবং ম্যাপ এর মধ্যে একটি সম্পর্ক তৈরী হয়।

ক্লিক এরিয়াসহ একটি ইমেজ-ম্যাপ তৈরি করে নিচের উদাহরণে দেখানো হলোঃ

উদাহরণ

<!DOCTYPE html>
<html>
<body>
<p>সূর্য অথবা নক্ষত্রগুলো ক্লিক করলে অনেক কাছে দেখাবে।</p>
<img src="images/planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.html">
<area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.html">
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.html">
</map>
</body>
</html>

ফলাফল

সূর্য অথবা নক্ষত্রগুলো ক্লিক করলে অনেক কাছে দেখাবে।

এট্রিবিউট

নিচের টেবিলে <area> ট্যাগের এট্রিবিউট, এট্রিবিউটের ভ্যালু এবং তাদের ব্যবহার তুলে ধরা হলোঃ

এট্রিবিউট	ভ্যালু	বর্ণনা
alt	text	যদি href এট্রিবিউট থাকে তবে এরিয়াটির জন্য একটি বিকল্প টেক্সট নির্ধারন করে।
coords	coordinates	কো-অর্ডিনেট এরিয়া নির্ধারন করে।
download	filename	যখন একজন ব্যবহারকারী হাইপারলিংক ক্লিক করবে তখন নির্দিষ্ট ফাইলটি ডাউনলোড হবে।
href	URL	হাইপারলিংক এর টার্গেট এরিয়া নির্ধারন করে।
hreflang	language_code	টার্গেট URL এর ভাষা নির্দেশ করে।
media	media query	কি ধরনের মিডিয়া/ডিভাইস এ টার্গেট URL টি অপ্টিমাইজ করা হয়েছে তা নির্দেশ করে।
nohref	value	এইচটিএমএল(৫) এ সমর্থন করে না। এমন একটি এরিয়া নির্দেশ করে যার সংশ্লিষ্ট কোন লিংক নেই।
rel	alternate author bookmark help license next nofollow noreferrer prefetch prev search tag	বর্তমান ডকুমেন্ট এবং টার্গেট URL এর মধ্যে সম্পর্ক নির্দেশ করে।
shape	default rect circle poly	এরিয়ার আকৃতি নির্দেশ করে।
target	_blank _parent _self _top framename	টার্গেট URL কোথায় ওপেন হবে তা নির্দেশ করে।
type	media_type	টার্গেট URL এর মিডিয়ার ধরন নির্দেশ করে।