آموزش HTML – تصاویر

کار با تصاویر در html

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

تصاویر در HTML

حتما قبل از بررسی نوشته‌ی تصاویر در HTML مطالب قبلی این دوره‌ی آموزشی را با هشتگ #دوره_آموزشی_HTML در سایت ما را مطالعه کنید.

برای قرار دادن تصویر شما به تگ مفرد img نیاز دارید؛ تگ مفرد در واقع تگی است که باز و بسته‌ی آن به صورت جداگانه زوج نیستند و روی تگ شروع تگ بسته خواهد شد. برای افزودن تصویر به متحوای صفحاتتان در HTML کافیست کد زیر را اضافه کنید:

<img src=""  />

خب حالا به بررسی قطعه کد بالا می‌پردازیم؛ همان‌طور که در بالا می‌بینید. تگ img برای افزودن تصاویر در صفحات html استفاده خواهند شد. خصیصه اجباری، مهم و در تمامی موارد ثابت تگ img، خصیصه ی src است. وظیفه نگهداری آدرس تصویر مورد نظر را دارد.

مثال:

<img src="http://camelcase.ir/wp-content/themes/camelcase/assets/img/logo.png" />

نکته:

همیشه نیاز نیست آدرس تصاویر به طور کامل بیان شوند بلکه در صورتی که فایل تصویر در کنار سند html است. یا در فولدری کنار سند html می‌توان به طور نسبی به خصیصه‌ی src مقدار داد تا در تغییرات به مشکل برنخورید. تگ img یک تگ انعطاف پذیر است و دارای خصیصه‌های دیگری است که برای یادگیری آن‌ها می‌توانید از مرجع معتبر W3School استفاده کنید؛ البته باید به این نکته توجه کنید که در این سری آموزشی ما خاصیت‌هایی که درجه‌ی اهمیت بالایی دارند را برای شما به مرحله آموزش خواهیم رساند.

برای استفاده از تمامی جلسات از هشتگ #دوره_آموزشی_HTML در سایت ما استفاده کنید.

منتظر جلسه ی بعدی دوره‌ی آموزشی HTML بمانید.