عنصر HTML: ناحیه

نحو

1

<map name="map">

2

  <area shape="rect"coords="0, 0, 50, 50" href="page.html">

3

</map>

مثال

1

<img src="image.jpg" usemap="#mymap">

2

3

<map name="mymap">

4

  <area shape="rect" coords="0, 0, 50, 50" href="page1.html">

5

  <area shape="rect" coords="50, 0, 100, 50" href="page2.html">

6

  <area shape="rect" coords="0, 50, 50, 100" href="page3.html">

7

  <area shape="rect" coords="50, 50, 100, 100" href="page4.html">

8

</map>

در این مثال تصویری با نقشه ای به نام داریم mymap. نقشه دارای چهار منطقه است که با <area> عنصر، هر کدام با شکل، مختصات و URL متفاوت است.

نتیجه

در اینجا نحوه استفاده از یک تصویر با چهار ناحیه آمده است:

ویژگی های

را <area> برچسب پشتیبانی می کند ویژگی های جهانی در HTML. ویژگی های جهانی برای همه عناصر HTML مشترک هستند و می توانند روی همه آنها استفاده شوند (اگرچه ممکن است روی برخی تأثیر زیادی نداشته باشند).

• shape: قابل تنظیم است circle، default، poly، یا rectبسته به شکل ناحیه قابل کلیک.
• coords: مختصات ناحیه قابل کلیک را مشخص می کند (جزئیات بیشتر در زیر).
• href: نشانی اینترنتی را مشخص می کند که ناحیه قابل کلیک باید به آن پیوند داشته باشد.

سایر صفات عبارتند از alt، target، download، ping، rel، و referrerpolicy.

چگونه coords ویژگی کار؟

را coords ویژگی جایی است که مختصات را تعریف می کنیم shape صفت.

به عنوان مثال، اگر شکل است rect (مستطیل) همانطور که در نسخه ی نمایشی ما در بالا، شما باید تعریف کنید بالا سمت چپ و سمت راست پایین مختصات مستطیل یک مستطیل با مختصات 0,0,50,50 گوشه سمت چپ بالای آن قرار می گیرد 0,0 و گوشه پایین سمت راست آن در 50,50:

بنابراین این مستطیل است، اما برای اشکال دیگر coords ویژگی ها مقادیر مختلفی را می پذیرند:

• circle: مقدار پذیرفته شده است x,y,radius جایی که x,y مختصات مرکز دایره و به دنبال آن شعاع هستند.
• poly: مقدار پذیرفته شده است x1,y1,x2,y2,..,xn,yn جایی که جفت ها نقاطی را در امتداد لبه های چند ضلعی دیکته می کنند. انتظار می رود اولین و آخرین جفت مختصات یکسان باشند، اما اگر اینطور نباشد مرورگر آخرین مقدار را برای بستن شکل اضافه می کند.

محتوا

را <area> عنصر اغلب همراه با استفاده می شود <img> عنصر، اما می توان آن را با عناصر دیگری مانند <object> و <canvas>. عنصر را می توان زمانی که عبارت بندی محتوا انتظار می رود، اما تنها در صورتی که وجود داشته باشد map جد عنصر

آیا میدانستید؟

• را <area> عنصر برای اولین بار در HTML 3.2 معرفی شد که در سال 1997 منتشر شد!
• هنگام نوشتن یک برچسب پایانی لازم نیست <area> برچسب زدن

بیشتر بدانید

• مشخصات رسمی W3C <area>