ایچ تی ایم ایل تصویر

بائوروزر میں تصویر کو استعمال کرکے ڈاکومن میں دکھایا جاسکتا ہے

مثال

تصویر کو داخل کرنا
اس مثال میں ویب پیج میں کیسے تصویر کو دکھایا جاتا ہے، دکھایا جاتا ہے
مختلف مقامات سے تصویر کو داخل کرنا
اس مثال میں دوسرے فولدر یا سرور کی تصویر کو ویب پیج میں کیسے دکھایا جاتا ہے، دکھایا جاتا ہے

(اس ویب پیج کے نیچے زیادہ مثالیں مل سکتی ہیں)

تصویر کا لبل (<img>) اور سورس پرپرتی (Src)

بائوروزر میں تصویر کو <img> لبل کے ذریعے دکھایا جاتا ہے۔

<img> خالی لبل ہے، یعنی اس میں صرف پرپتیاں موجود ہیں اور اس کا ختم لبل نہیں ہوتا۔

اگر آپ پہلے تصویر کو پہلے دکھانے کا خواہش رکھتے ہیں تو آپ کو سورس پرپرتی (src) استعمال کرنا چاہئیے۔ src کا مطلب 'source' ہے۔ سورس کی پارٹی تصویر کا URL آدرس ہوتی ہے。

تصویر کا تعریف کا زبان:

<img src="url" />

URL تصویر کو ذخیرہ کرنے کا مقام کا نام ہے اگر نام کو 'boat.gif' رکھتے ہیں تو تصویر کو 'www.codew3c.com' کے 'images' فولدر میں رکھا گیا ہے تو اس کا URL یہ ہوگا http://www.codew3c.com/images/boat.gif。

بائوروزر کچھ ڈاکومن میں تصویر کو اس مقام پر دکھاتا ہے جہاں تصویر کا لبل موجود ہے اگر آپ تصویر کا لبل دو پاراگرافوں کے درمیان رکھتے ہیں تو بائوروزر پہلے پہلا پاراگراف دکھاتا ہے، بعد میں تصویر کو دکھاتا ہے اور آخری میں دوسرا پاراگراف دکھاتا ہے。

مقابل کریپت (Alt)

ویژگی alt برای تعریف یک توالی متن جایگزین برای تصویر استفاده می‌شود. ارزش متن جایگزین توسط کاربر تعیین می‌شود.

<img src="boat.gif" alt="Big Boat">

در صورت عدم بارگذاری تصویر توسط مرورگر، متن جایگزین به خوانندگان اطلاعاتی از دست رفته را می‌دهد. در این حالت، مرورگر این متن جایگزین را به جای تصویر نمایش می‌دهد. افزودن متن جایگزین به تمام تصاویر صفحه یک عادت خوب است، این کار به بهبود نمایش اطلاعات کمک می‌کند و برای کسانی که از مرورگرهای متن‌محور استفاده می‌کنند بسیار مفید است.

ملاحظات اساسی - نکات مفید:

اگر یک فایل HTML ده تصویر داشته باشد، برای نمایش صحیح صفحه، نیاز به بارگذاری ۱۱ فایل است. بارگذاری تصاویر زمان‌بر است، بنابراین توصیه ما این است: از تصاویر با دقت استفاده کنید.

مثال‌های بیشتر

تصویر پس‌زمینه
این مثال نشان می‌دهد که چگونه تصویر پس‌زمینه به صفحه HTML اضافه شود.
چیدمان تصویر
این مثال نشان می‌دهد که چگونه تصویر را در متون قرار دهید.
تصویر شناور
این مثال نشان می‌دهد که چگونه تصویر را به سمت چپ یا راست یک پاراگراف قرار دهید.
تنظیم اندازه تصویر
این مثال نشان می‌دهد که چگونه تصویر را به اندازه‌های مختلف تنظیم کنید.
نمایش متن جایگزین برای تصویر
این مثال نشان می‌دهد که چگونه متن جایگزین برای تصویر نمایش داده شود. در صورت عدم بارگذاری تصویر توسط مرورگر، متن جایگزین به خوانندگان اطلاعاتی از دست رفته را می‌دهد. افزودن متن جایگزین به تمام تصاویر صفحه یک عادت خوب است.
ساخت لینک تصویر
این مثال نشان می‌دهد که چگونه تصویر را به عنوان یک لینک استفاده کنید.
ایجاد نقشه تصویر
این مثال نشان می‌دهد که چگونه یک نقشه تصویر با مناطق قابل کلیک ایجاد کنید. هر منطقه یک لینک است.
تبدیل تصویر به نقشه تصویر
این مثال نشان می‌دهد که چگونه یک تصویر معمولی را به نقشه تصویر تبدیل کنید.

برچسب تصویر

برچسب توضیح
<img> تعریف تصویر.
<map> تعریف نقشه تصویر.
<area> تعریف منطقه قابل کلیک در نقشه تصویر.