تصویر فقط مستقیماً در متن درج نمی شود. به مرورگر نامش گفته می شود و به آن آموزش داده می شود که کجا و چگونه آن را روی صفحه قرار دهد. برای این کار از یک تگ img HTML استفاده کنید. این مکان شیء گرافیکی را در صفحه وب مشخص می کند.
اگر بسیاری از ویژگی ها برای تگ ها اختیاری هستند، تگ img باید حداقل یک پارامتر داشته باشد - آدرس تصویر. این ویژگی src نام دارد:
- - این فایل goat-j.webp" />
- - با این پارامتر تگ img، مرورگر تصویر ارسال شده در اینترنت را در سایت megasellmag.ru بارگذاری می کند.
ویژگی های تراز
برای قرار دادن تصاویر در صفحه با استفاده از HTML، از تگ img استفاده می شود که ویژگی های آن وظیفه قرار دادن تصویر در صفحه و ماهیت بسته بندی متن آن را بر عهده دارد.
به طور پیشفرض، مرورگر تصویر را در مرکز صفحه قرار میدهد و متن دور آن نمیپیچد. تگ img به شما این امکان را می دهد که با استفاده از ویژگی align (alignment) مخالفت خود را با مرورگر بیان کنید.
- تصویر در لبه سمت چپ صفحه قرار می گیرد و متن در اطراف آن در سمت راست قرار می گیرد.
رفتار متن مشابه خواهد بود اگر تصویر در سمت راست (تراز=راست)، در وسط (تراز=وسط)، بالا (تراز=بالا)، پایین قرار گیرد.(تراز=پایین) و مرکز (مرکز).
تنظیمات و اندازه
برای جلوگیری از خزیدن متن در تصاویر، تگ img دارای ویژگی های خاصی است -hspace (حاشیه افقی/افقی) و vspace (حاشیه عمودی/عمودی) که میزان فرورفتگی متن را از لبه های تصاویر در آن تعیین می کند. پیکسل.
تصویر نه تنها به میزان مشخص شده از متن دور می شود، بلکه از لبه صفحه نیز دور می شود، بنابراین بهتر است از تورفتگی های بزرگ خودداری کنید.
ابعاد هندسی تصاویر بسیار مهم است که برای نمایش صحیح تصویر نه تنها مطلوب نیست، بلکه گاهی اوقات صرفاً ضروری است. برای این کار از ویژگی های عرض (عرض) و ارتفاع (ارتفاع) استفاده می شود که مقدار آنها بر حسب پیکسل یا درصد تنظیم می شود.
اگر فقط عرض را مشخص کنید، ارتفاع به طور خودکار با نسبت های اصلی انتخاب می شود. اندازههای درصدی به شما امکان میدهند بدون توجه به اندازه پنجره مرورگر، تصویر را در قسمت سمت راست صفحه قرار دهید، و این نیاز اغلب ایجاد میشود.
گزینه های دیگر
ویژگی border تصویر را در فریمی با ضخامت مشخص قرار می دهد که مرورگر به طور پیش فرض این کار را انجام نمی دهد.
حاشیه همچنین می تواند یک عرض صفر به ظاهر بی معنی داشته باشد (حاشیه='0')، اما این تا زمانی است که تصویر به یک پیوند تبدیل شود، زمانی که مرورگر به طور خودکار آن را با یک حاشیه آبی بدون انتظار دستورالعمل دور می زند.
برخی از کاربران بی حوصله، خشمگین از سرعت پایین اینترنت، به سادگی نمایش تصاویر را غیرفعال می کنند. برای چنین مواردی، پارامتر alt ارائه شده است که به شما امکان می دهد وارد شویدمتن جایگزینی که کاربر در کادری که تصویر در آن عجله دارد می بیند.
اگر از امکانات پارامتر alt خوشتان نمی آید، تگ img می تواند ویژگی longdesc را ارائه دهد که مقدار آن URL یک سند با توضیحات دقیق تر است.
ویژگیهای usemap و ismap به مرورگر میگویند که تصویر تصویری خواهد بود که در آن لینکها مناطق مجزا هستند (نقشه پیوند)، تنها پارامتر usemap نقشه ناوبری را در سرور تعیین میکند، و ismap - نقشه در سمت مشتری.
شرح پیوند 1 در شکل زیر:
اقلام عجیب و غریب
ویژگی lowsrc به مرورگر دستور می دهد که ابتدا یک کپی (یا جایگزین دیگر) از تصویر اصلی را با کیفیت پایین تر و بنابراین "سبک تر" دانلود کند. این ترفند در صورت سرعت پایین اینترنت برای کاربر ارائه شده است. تصویر اصلی، هنگام آپلود، جایگزین "جعلی" می شود.
ویژگی galleryimg تگ img که کمتر مورد استفاده قرار می گیرد، پانل کنترل تصویر را فراخوانی می کند (هنگامی که ماوس را روی آن قرار می دهید)، به شما این امکان را می دهد که پوشه پیش فرض My Pictures را باز کنید و تصویر را چاپ، ذخیره یا ایمیل کنید. میتوانید با تنظیم پارامتر galleryimg روی no/false پانل را غیرفعال کنید و با تنظیم yes/true آن را فعال کنید.
در مشخصات جدید HTML5، تعدادی از برچسب ها دارای برخی از پارامترها منسوخ شده اند. برای مثال، ویژگیهای lowsrc، border، longdesc و name img حذف شدهاند.