آموزش تگ area در HTML
آخرین بروزرسانی:
آموزش تگ area در HTML
تگ <area>
در HTML برای تعیین ناحیههای قابل کلیک در نقشههای تصویری (image maps) استفاده میشود. این تگ اطلاعات مربوط به هر ناحیه قابل کلیک را تعیین میکند که با کلیک کاربر بر روی آن، اقدام مربوط به آن ناحیه صورت میگیرد. در این مقاله، به توضیح مفهوم و استفاده از تگ <area>
به همراه مثالهای کاربردی میپردازیم.
1. توضیح مفهومی تگ area در HTML
تگ <area>
در HTML برای تعیین ناحیههای قابل کلیک در نقشههای تصویری (image maps) استفاده میشود. این تگ اطلاعات مربوط به هر ناحیه قابل کلیک را تعیین میکند که با کلیک کاربر بر روی آن، اقدام مربوط به آن ناحیه صورت میگیرد.
2. ویژگیهای تگ area
- shape: نوع شکل ناحیه قابل کلیک که میتواند یکی از مقادیر
rect
(مستطیل)،circle
(دایره) یاpoly
(چندضلعی) باشد. - coords: مختصات نقاط مربوط به ناحیه قابل کلیک. برای مثال، برای یک مستطیل، چهار عدد تعیین کننده مختصات گوشههای مستطیل به ترتیب
x1, y1, x2, y2
میباشد. - href: آدرس مقصد که کاربر به آن هدایت میشود پس از کلیک بر روی ناحیه.
- alt: متن جایگزین برای ناحیه قابل کلیک، که در صورت عدم نمایش تصویر مورد استفاده قرار میگیرد.
3. نحوه استفاده از تگ area
<map name="image-map">
<area shape="rect" coords="0,0,50,50" href="page1.html" alt="Area 1">
<area shape="circle" coords="100,100,50" href="page2.html" alt="Area 2">
<area shape="poly" coords="150,150,200,200,250,150" href="page3.html" alt="Area 3">
</map>
<img src="image.jpg" usemap="#image-map" alt="Image Map">
4. مثال کاربردی
<map name="nav-map">
<area shape="rect" coords="0,0,100,50" href="home.html" alt="Home">
<area shape="rect" coords="100,0,200,50" href="about.html" alt="About">
<area shape="rect" coords="200,0,300,50" href="contact.html" alt="Contact">
</map>
<img src="navbar.jpg" usemap="#nav-map" alt="Navigation Bar">
5. توضیحات
- تگ
<area>
باید داخل یک تگ<map>
قرار بگیرد که باusemap
در تگ<img>
مربوط به نقشه تصویری (image map) مرتبط میشود. - هر ناحیه قابل کلیک با استفاده از تگ
<area>
به یک آدرس مقصد (href
) هدایت میشود و متن جایگزین (alt
) نیز برای آن تعیین میشود.
تگ <area>
در HTML برای تعیین ناحیههای قابل کلیک در نقشههای تصویری استفاده میشود. این تگ اطلاعات مربوط به هر ناحیه قابل کلیک را تعیین میکند که با کلیک کاربر بر روی آن، اقدام مربوط به آن ناحیه صورت میگیرد.
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام