آموزش کامل HTML – قسمت پنجم: عکس ها

در قسمت چهارم آموزش html با لینک ها آشنا شدیم. در این قسمت در مورد عکس ها و اضافه کردن آن ها به صفحات وب صحبت می کنیم.

اضافه کردن عکس

برای اضافه کردن عکس در اچ تی ام ال از تگ <img> استفاده می کنیم. بعد از img آدرس عکس را وارد می کنیم. برای این کار از اتربیوت src به صورت زیر استفاده می کنیم.

<img src=”آدرس عکس”/>

همان طور که مشاهده می کنیم تگ فوق نیاز به بستن با تگ جداگانه ندارد. برای نمایش دادن عکس باید نام و فرمت عکس را دقیقا با آدرس عکس بنویسیم.

اتربیوت alt

این صفت در واقع متنی است که اگر عکس ما به هر دلیلی لود نشود به جای آن نشان داده می شود. این ویژگی در جستجو های گوگل هم استفاده می شود. همچنین alt برای افراد معلول در دستگاه های خواندن صفحه مانند بریل نیز کاربرد دارد.

<img src=”url” alt=”کلمه یا متن مورد نظر”/>

تنظیم ابعاد تصویر

برای تنطیم اندازه تصویر از صفت style استفاده می کنیم. اندازه تصاویر را بر حسب پیکسل مشخص می کنیم.

<img src=”url” style=”width:250px; height:350px;”/>

استفاده از اتربیوت style همیشه ضروری نیست و می توانید طول و عرض را به صورت مستقیم بنویسید. مثلا کد زیر مانند فوق عمل می کند:

<img src=”url” width=”350px” height=”250px”/>

پایان قسمت پنجم