آموزش تگ map در HTML
آموزش تگ map در HTML
دوست من سلام امیدوارم حالتون عالی و پر از انرژی باشید. توی این بخش از آموزش html css قراره که با آموزش تگ map در HTML به صورت کامل آشنا بشید.
تگ Map در HTML
تگ map یا ( مَپ ) تگی است که با استفاده از آن این امکان هست که یک نقشه ی تصویری یا Image-Map را در یک صفحه وب ساخت.
نقشه تصویری : با یک قاعده ی کلی به یک عکس یا تصویر که دارای چندین نقطه و محدوده ی قابل کلیک ( یعنی کاربر بتونه رو اون نقاط کلیک کنه ) باشد، نقشه تصویری گفته می شود.
برای درست کردن یک نقشه تصویری ما باید از تگ img برای ایجاد تصویر یا عکس مورد نظرمون استفاده کنیم و از تگ map و تگ area نیز برای ایجاد نقاطی که قابلیت کلیک دارند بروی تصویر مورد نظرمون استفاده کنیم.
راستی اگر دنبال آموزش html css پروژه محور هستید می توانید از دوره ی آموزش وردپرس پوش استفاده کنید. جهت مشاهده ی 28 ساعت ویدیو آموزشی با پشتیبانی مادام العمر روی این لینک کلیک کنید.
مثال از تگ map در HTML
در ادامه ی آموزش html و css میتوانید یک مثال از این تگ را مشاهده کنید.
مثال شماره یک : عکسی را که در زیر مشاهده می کنید،یکی از مثال های این مورد است. در تصویر زیر فقط برای اینکه شما بدونید کدام ناحیه ها قابل کلیک هستند، بنده اون نقاط رو برای درک بهتر شما مشخص کردم.
<body> برای مشاهده دستورات بروی دکمه امتحان کنید کلیک کنید </body>
پشتیبانی مرورگرها
در جدولی که در پایین مشاهده می کنید به این نتیجه می رسید که آیا مرورگرهای اینترنتی از تگ map در HTML پشتیبانی میکنند یا خیر.
جدول صفات تگ map در HTML
در جدول زیر میتوانید مشاهده کنید که چه صفات و چه مقادیری را میتوان در این تگ استفاده کرد.
پشتیبانی از صفات و رویدادهای عمومی
تگ map از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.
نکات و توضیحات
- نامی را که در صفت usemap در تگ img انتخاب می کنید باید با نامی که در صفت name در تگ map قرار دارد یکی و عین هم باشد.
دستورات CSS پیش فرض
در اغلب مرورگرها تگ map را بصورت پیش فرض با دستورات CSS زیر نمایش میدهند.
map {
display: inline;
}
شما میتوانید با دوره ی آموزشی html css در این موارد بسیار مهارت پیدا کنید.
در صورتی که مشکلی دارید و قادر به حل آن نیستید می توانید با ما در تماس باشید
دیدگاهتان را بنویسید