%40 تخفیف، با کد Ramazan روی تمام آموزش ها، بمناسبت ماه مبارک رمضان
زمان باقی مانده (تمدید شد)
سبد (0)

تبلیغات

تگ area در HTML

مثال (تگ area در HTML)

یک image-map، با نواحی قابل کلیک:

<img src="/planets.gif" width="145" height="126" alt="Planets"
usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="/sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="/mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="/venus.htm" alt="Venus">
</map>

خودتان امتحان کنید »

تعریف و کاربرد تگ area در HTML

تگ <area> منطقه ای را در داخل یک image-map مشخص می کند. (image-map به تصویری گفته می شود که بعضی قسمت های آن قابلیت کلیک کردن است)

تگ <area> همیشه داخل یک تگ <map> قرار می گیرد.

نکته:  صفت usemap در تگ <img> با صفت name در تگ <map> مرتبط هستند در نتیجه بین این دو تگ ارتباط برقرار می شود.


پشتیبانی مرورگرها از تگ area در HTML

عنصر          
<area> بله بله بله بله بله

تفاوت بین HTML 4.01 و HTML5

در HTML5 یک سری ویژگی های جدید به این تگ اضافه شده و برخی از ویژگی های HTML4.01 در HTML5 پشتیبانی نمی شود.


تفوت بین HTML و XHTML

در HTML تگ <area>، تگ پایانی ندارد .

در XHTML تگ <area> باید با تگ پایانی خاتمه یابد.


خصوصیت ها

 جدید در HTML5.

خصوصیت مقدار توضیحات
alt text یک متن جایگزین (alternate) برای area مشخص می کند و همراه با صفت href به کار می رود.
coords coordinates مشخص کردن مختصات در area
download filename مشخص کردن منبع دانلود زمانی که کاربر روی یک لینک کلیک می کند.
href URL مشخص کردن مقصد لینک برای area
hreflang language_code برای لینک کردن language به سند
media media query مشخص می کند مقصد لینک شده برای چه media (رسانه) یا دستگاهی بهینه است.
nohref value در HTML5 پشتیبانی نمی شود.
مشخص می کند که <area> هیچ لینک مرتبطی ندارد.
rel alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
رابطه بین سند رایج با سند لینک شده را مشخص می کند.
shape default
rect
circle
poly
مخصوص شکل دادن به area
target _blank
_parent
_self
_top
framename
مشخص می کند URL(سند لینک شده) کجا باز شود.
type media_type نوع media (رسانه) لینک شده را مشخص می کند.

ویژگی های عمومی تگ area در HTML

تگ <area> از ویژگی های عمومی در HTML پشتیبانی می کند.


رویدادهای عمومی تگ area در HTML

تگ <area> از رویدادهای عمومی در HTML پشتیبانی می کند.


آموزش های مرتبط

مرجع اشیاء اچ تی ام ال: تگ Area در JavaScript

دیدگاه‌ها  

0 # salimi 1395-08-11 12:03
سلام.خسته نباشید.
من یه textarea دارم که داخلش متن وارد می کنم و می خوام پایین این textarea یک box از emoji (شکلک)ها باز بشه و من با انتخاب اون شکلک بتونم به متن اضافش کنم و کاربر متن را با شکلک ببینه اگه جوری باشه که شکلک را انتخاب کنم کاراکتر(-(..) مربوط به اون در متن درج بشه و بعد من بتونم اون رو در سمت کاربر تبدیل کنم خیلی بهتره. ممنون میشم کمکم کنید
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # مهرداد صلاحی 1395-08-13 08:08
با سلام.
تا جایی که اطلاع دارم، این حرکت با textarea شدنی نیست. اگرم هم باشه به این صورته:
برای این کار شما باید از iframe و به همراه آن از کدنویسی سمت کلاینت استفاده کنی. توضیح مفصل هست! بهتره عبارت emoji with iframe or textarea رو در گوگل سرچ کنید.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # ehsantak 1395-06-09 15:56
سلام خاصیت coords که نوشتین مختصاتی که روی عکس میخوایم لینک بشه رو چطوری باید انتخاب کنیم؟
ممنون .
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # شهربانو دوستی 1395-06-14 02:24
سلام تصویر مورد نظر رو در برنامه فتوشاپ باز کنید مختصات نقاط مورد نظر رو با استفاده از این برنامه میتونید به دست بیارید . نحوه انجام کادر در فیلم اموزشی مقدماتی تا پیشرفته html ذکر شده.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # E.S.I 1395-04-20 17:10
سلام . با چه تگی میشه جمله رو تکرار کرد .
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # مهرداد صلاحی 1395-04-22 20:00
سلام.
لینک باز نمیشه. ولی برای تکرار نمایش یک نوشته می‌تونید از خاصیت بک‌گراند در CSS استفاده کنید.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # حسن محسنی 1394-09-16 13:01
ضمن عرض سلام و خسته نباشید و خدا قوت بابت زحماتتون برای این سایت بسیار عالی.
سوالم در مورد خصوصیت download هست که دقیقا متوجه نشدم چیکار میکنه یعنی یه تایمی برای کلیک کردن روی لینک میده؟ یا بعد از یه مدتی لینک فعال میشه؟ یا مثلا برای دانلود فایل هست که تا یه زمان مشخصی اجازه دانلود رو میده؟ یا کلا یه چیز دیگه س! دوم اینکه مقدارش رو filename قرار دادین یعنی چی؟!
سوالم سوم هم در مورد خصوصیت rel بود که هر کدوم از این حالت ها کجا استفاده میشه؟
ممنون از راهنمایی تون.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # hamid fa 1394-09-17 01:49
با سلام خدمت شما دوست عزیز و گرامی

در مورد سوالتون باید بگم rel ارتباط بین دو صفحه رو مشخص میکنه منظور از ارتباط این است که مثلا در یک صفحه اچ تی ام ال سندی که میخواهیم لینک شود به آن ارتباط آن از چه نوعی باشد مثلا اگر فایل css باشد ارتباط آن ازنوع stylesheet است

و در مورد خصوصیت دانلود در html5 باید بهتون بگم این خصوصیت دقیقا وقتی شما رو کدتون و توی تگ a این خصوصیت رو بذارید میتونید نام فایل رو به راحتی تغییر بدید

اگه بازم مشکلی بود من و همکارانم 24 ساعته در خدمت هستیم

با تشکر از شما و همراهیتان
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان