ویژگی alt برچسب <img> HTML
تعریف و استفاده
alt ویژگی یک ویژگی ضروری است که متن جایگزین را در صورت نمایش داده نشدن تصویر مشخص می‌کند.
اگر کاربر نتواند تصویر را مشاهده کند به دلیل دلایل زیر، ویژگی alt می‌تواند اطلاعات جایگزین برای تصویر ارائه دهد:
- سرعت اینترنت کند
- اشتباه در ویژگی src
- تصاویر در مرورگر غیرفعال
- کاربر از صفحه‌خوان استفاده می‌کند
ویژگی alt برچسب <img> متن جایگزین را مشخص می‌کند، که در صورت نمایش داده نشدن تصویر یا وقتی که نمایش تصاویر در مرورگر غیرفعال است، به جای تصویر در مرورگر نمایش داده می‌شود.
ما به شدت توصیه می‌کنیم که شما این ویژگی را در هر تصویر از مستند خود استفاده کنید. به این ترتیب حتی اگر تصویر نمایش داده نشود، کاربر می‌تواند اطلاعات مربوط به چیزی که از دست رفته است را ببیند. و همچنین برای افراد معلول، ویژگی alt معمولاً تنها راهی است که آنها می‌توانند محتوای تصویر را بفهمند.
توجه:برای ایجاد ابزار توضیحی برای تصویر از ویژگی title!
توضیحات و یادداشت‌ها
توضیحات:alt مقدار ویژگی یک رشته است که حداکثر می‌تواند شامل 1024 کاراکتر باشد، از جمله فضاهای خالی و علامت‌های پونکشن. این رشته باید در قفصه‌ها قرار گیرد. این متن alt می‌تواند شامل ارجاع به کاراکترهای خاص باشد، اما اجازه ندارد شامل برچسب‌های دسته دیگر باشد، به ویژه اجازه ندارد هیچ برچسب استایل داشته باشد.
توضیحات:وقتی کاربر ماوس را روی عنصر img حرکت می‌دهد، اینترنت اکسپلورر مقدار ویژگی alt را نمایش می‌دهد. این رفتار صحیح نیست. تمام مرورگرهای دیگر به استاندارد نزدیک‌تر هستند، تنها زمانی که تصویر نمایش داده نمی‌شود، متن جایگزین نمایش داده می‌شود.
توجه:اگر می‌خواهید ابزار توضیحی برای تصویر ایجاد کنید، از ویژگی title。
مثال
مثال 1
<img src="/i/eg_tulip.jpg" alt="شهر گل‌های شانگهای - تورتیل" />
اگر تصویر نمایش داده نشود، مرورگر متن جایگزین را نمایش می‌دهد، مانند این:
علاوه بر این، هنگامی که کاربر ماوس را بر روی تصویر بالا می‌برد، مرورگرهای جدیدترین در یک قاب متنی متن توصیفی نمایش می‌دهند. کد زیر متن توصیفی را در ویژگی alt برای تصویر اضافه می‌کند:
می‌توانید ماوس را بر روی تصویر زیر حرکت دهید و تأثیر آن را مشاهده کنید:
متن قرمز در دایره، هنگامی که کاربر ماوس را بر روی تصویر حرکت می‌دهد، در مرورگر IE7 نمایش داده می‌شود:
مثال 2
تصویری که متن جایگزین برای آن تعیین شده است:
<img src="img_girl.jpg" alt="Girl in a jacket" width="500" height="600">
قوانین
<img alt="text">
مقدار ویژگی
| مقدار | توصیف |
|---|---|
| text |
تعیین متن جایگزین برای تصویر. اصل استفاده از متن alt:
|
پشتیبانی از مرورگر
| Chrome | Edge | Firefox | Safari | opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | opera |
| پشتیبانی | پشتیبانی | پشتیبانی | پشتیبانی | پشتیبانی |
