آموزش جامع HTML و CSS از صفر و روان! - HTML چیست

آموزش جامع HTML و CSS از صفر و روان!

۲۲ ویدیو
x64 -۲۲ / ۱۱

آموزش جامع HTML و CSS (قسمت 11) - تگ img

x64
x64

یه تگ مهم براتون آوردیم. خییییییییییییلی دقت کنین. یکی اجزای مهمِ زیبایی و کارایی یک سایت، تصویر هست. که ما با استفاده از تگِ بسته <img> میتونیم تصاویر موردنظرمون رو تو سایت قرار بدیم.

صفت های ( attribute ) مهمِ برایِ تگ <img> :
src :

هونطور که قبلا هم گفتیم این صفت برای آدرس دادن فایل مورد نظرمون هست. برای این منظور پوشه به نام ” images ” ساختیم و عکس مورد نظرمون رو داخل اون گذاشتیم. اسم پوشه رو هر چی که دوست دارین میتونین بذارین ولی دقت کنین که حتما با حروف لاتین باشه. حتی اگه نخواستین میتونین پوشه هم درست نکنین و عکس رو همین طوری کنار فایل index , style بگذارین ولی این کار استاندارد نیست ، چون که در یک سایت عکس های زیادی قرار میگیره و همچنین فایل های دیگه ای هم باید اضافه کنیم . پس برای راحتی کار و عملکرد بهتر باید حتماً پوشه جداگانه برای تصاویرمون بسازیم.
alt :

مخفف کلمه alternate هست که به عنوان متن جایگزین عکس به کار می رود. اگه به هر دلیلی عکس ما نمایش داده نشه، اون وقت متنی که داخل alt نوشتیم، نشون داده میشه.
title :

اگر دقت کرده باشین وقتی داخل یک سایت میرین و نشانگر موس رو روی بعضی ار المان ها می برین، یک کادری زیر نشانگر ظاهر میشه که داخلش یک متنی رو نوشته. این اتفاق با گذاشتن صفت title میوفته که اگر ازش استفاده بکنین بهتر هست.
width , height :

به ترتیب از راست، ارتفاع و عرض عکس رو مشخص میکنن. توصیه می کنیم این کار رو حتما انجام بدین تا هر عکسی که در سایت قرار دادین به همون اندازه دلخواهتون نمایش داده بشه. جلوتر که بریم بیشتر توضیح میدیم. فعلاً در همین حد کافیه.

نکته : هر صفتی که برای تگی توضیح میدیم معنیش این نیست که فقط برای اون تگ قابل استفاده است بلکه تویِ تگ های دیگه هم بستگی به کاربردشون میشه ازشون استفاده کرد. مثلاً صفت src رو دیدین که هم برا تگ <link> و هم برای تگ <img> ازش استفاده کردیم.

نظرات

نماد کانال
نظری برای نمایش وجود ندارد.

توضیحات

آموزش جامع HTML و CSS (قسمت 11) - تگ img

۰ لایک
۰ نظر

یه تگ مهم براتون آوردیم. خییییییییییییلی دقت کنین. یکی اجزای مهمِ زیبایی و کارایی یک سایت، تصویر هست. که ما با استفاده از تگِ بسته <img> میتونیم تصاویر موردنظرمون رو تو سایت قرار بدیم.

صفت های ( attribute ) مهمِ برایِ تگ <img> :
src :

هونطور که قبلا هم گفتیم این صفت برای آدرس دادن فایل مورد نظرمون هست. برای این منظور پوشه به نام ” images ” ساختیم و عکس مورد نظرمون رو داخل اون گذاشتیم. اسم پوشه رو هر چی که دوست دارین میتونین بذارین ولی دقت کنین که حتما با حروف لاتین باشه. حتی اگه نخواستین میتونین پوشه هم درست نکنین و عکس رو همین طوری کنار فایل index , style بگذارین ولی این کار استاندارد نیست ، چون که در یک سایت عکس های زیادی قرار میگیره و همچنین فایل های دیگه ای هم باید اضافه کنیم . پس برای راحتی کار و عملکرد بهتر باید حتماً پوشه جداگانه برای تصاویرمون بسازیم.
alt :

مخفف کلمه alternate هست که به عنوان متن جایگزین عکس به کار می رود. اگه به هر دلیلی عکس ما نمایش داده نشه، اون وقت متنی که داخل alt نوشتیم، نشون داده میشه.
title :

اگر دقت کرده باشین وقتی داخل یک سایت میرین و نشانگر موس رو روی بعضی ار المان ها می برین، یک کادری زیر نشانگر ظاهر میشه که داخلش یک متنی رو نوشته. این اتفاق با گذاشتن صفت title میوفته که اگر ازش استفاده بکنین بهتر هست.
width , height :

به ترتیب از راست، ارتفاع و عرض عکس رو مشخص میکنن. توصیه می کنیم این کار رو حتما انجام بدین تا هر عکسی که در سایت قرار دادین به همون اندازه دلخواهتون نمایش داده بشه. جلوتر که بریم بیشتر توضیح میدیم. فعلاً در همین حد کافیه.

نکته : هر صفتی که برای تگی توضیح میدیم معنیش این نیست که فقط برای اون تگ قابل استفاده است بلکه تویِ تگ های دیگه هم بستگی به کاربردشون میشه ازشون استفاده کرد. مثلاً صفت src رو دیدین که هم برا تگ <link> و هم برای تگ <img> ازش استفاده کردیم.

آموزش