آموزش تگ img در HTML

آموزش تگ img در HTML

تگ <img> در HTML برای نمایش تصاویر در صفحات وب استفاده می‌شود. این تگ بسیار مهم است و به وسیله‌ی ویژگی‌های مختلف می‌توانید تصاویر را به صورت مناسب در صفحات خود قرار دهید. در این مقاله، توضیحاتی جامع و مفصل درباره تگ <img>، همچنین نحوه استفاده از تمامی ویژگی‌ها و مثال‌هایی ارائه می‌شود.

1. تگ img در HTML

تگ <img> برای درج تصاویر در صفحات وب استفاده می‌شود. این تگ بدون بسته شدن دارای برچسب خود است.

<img src="path/to/image.jpg" alt="توضیح تصویر">

2. ویژگی src

ویژگی src مشخص می‌کند که تصویر مورد نظر در کجا قرار دارد. این مسیر می‌تواند یک URL یا مسیر محلی در سرور شما باشد.

3. ویژگی alt

ویژگی alt توضیحی از تصویر را برای کاربرانی که تصویر نمایش داده نمی‌شود (به دلیل عواملی مانند اتصال اینترنت ضعیف یا مشکلات توسعه‌دهنده) فراهم می‌کند. همچنین، این توضیحات برای موتورهای جستجو نیز مفید است.

4. ویژگی width و height

ویژگی‌های width و height اندازه تصویر را مشخص می‌کنند. این ویژگی‌ها به صورت پیکسل است و می‌توانید آن‌ها را برای تنظیم اندازه تصویر به صورت دلخواه استفاده کنید.

<img src="path/to/image.jpg" alt="توضیح تصویر" width="300" height="200">

5. ویژگی title

ویژگی title توضیحی از تصویر را نمایش می‌دهد که هنگامی که کاربر موس را بر روی تصویر می‌برد، نمایش داده می‌شود.

<img src="path/to/image.jpg" alt="توضیح تصویر" title="عنوان تصویر">

6. ویژگی border

ویژگی border ضخامت حاشیه تصویر را مشخص می‌کند. این مقدار به صورت پیکسل است.

<img src="path/to/image.jpg" alt="توضیح تصویر" border="1">

نتیجه‌گیری

تگ <img> یکی از مهمترین تگ‌های HTML است که برای درج تصاویر در صفحات وب استفاده می‌شود. با استفاده از تمامی ویژگی‌ها و حالت‌های این تگ، می‌توانید تصاویر را به صورت مناسب در صفحات خود قرار دهید و تجربه کاربران را بهبود بخشید.

پست های مرتبط

مطالعه این پست ها رو از دست ندین!
JavaScript - رویدادها (Events)

JavaScript – رویدادها (Events)

رویدادهای HTML رویدادها در HTML، “اتفاقاتی” هستند که برای عناصر HTML رخ می‌دهند. این اتفاقات می‌توانند ناشی از کار...

بیشتر بخوانید
JavaScript - سازنده‌های شیء (Object Constructors)

JavaScript – سازنده‌های شیء (Object Constructors)

ساخت آبجکت با تابع سازنده (Object Constructor Function) برای ساخت چندین آبجکت مشابه، از تابع سازنده استفاده می‌شود. این...

بیشتر بخوانید
JavaScript - نمایش شیء (Object Display)

JavaScript – نمایش شیء (Object Display)

نحوه نمایش آبجکت‌ها در جاوااسکریپت هنگام نمایش یک آبجکت جاوااسکریپت به صورت مستقیم، خروجی معمولاً به شکل [object Object]...

بیشتر بخوانید

نظرات

سوالات و نظراتتون رو با ما به اشتراک بذارید

برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید.