Для вставки рисунка в HTML- сторінку використовується тег <img>.Основним параметром цього тегу є параметр src, за допомогою якого вказується адреса файлу, в якому і зберігається рисунок. Це й же тег також можливо використовувати для показу відео-роликів. В цьому випадку використовується параметр dynsrs,за допомогою якого вказується адреса відео файлу. Найпоширенішими форматами файлів-рисунків є формати :jpg, gif,png, а відео - avi.
При використанні відносного формату визначення місцезнаходження файлу-рисунку відбувається з урахуванням місцезнаходження даної HTML- сторінки.
Графічні файли зручно зберігати в окремому каталозі, наприклад, в каталозі з іменем img. В цьому випадку для вставки в HTML-сторінку prim.html рисунка logo.gif необхідно:
< img src = "img/logo. gif>
Розглянемо призначення параметрів. Досить часто при перегляді HTML- сторінок користувачі використовують браузер, що працює в режимі відключення завантаження зображень. Як відомо, цей режим дозволяє зменшити час відображення HTML-сторінки в вікні браузера. В цьому випадку замість зображення на екрані з'являється альтернативний текст, заданий в параметрі alt. Крім цього альтернативний текст відображається в якості підказки при знаходженні курсору "миші" в області рисунку. Параметри width та height призначені для визначення розмірів рисунку у вікні браузера. Відзначимо, що при зміні розмірів зображення розмір файлу не змінюється, тобто час завантаження рисунку не змінюється. Параметр borderдозволяє визначити товщину рамки навколо рисунку.
Параметри hspacc та vspaceдозволяють в пікселах задавати відступи від рисунку до інших об'єктів на HTML-сторінці. Параметр lowsrcдозволяє визначити файл з альтернативним зображенням, яке з'являється у вікні браузера до появи основного зображення. Параметр algn використовується для визначення горизонтального або вертикального вирівнювання рисунку відносно інших об'єктів на HTML сторінці. Параметри вирівнювання залежать від значень параметру align. При використанні цього параметру із значеннями left або right рисунок розміщується відповідно до лівої або правої сторони вікна браузера, а текст обтікає зображення з протилежної сторони. Відзначимо, що в цьому випадку текст може займати декілька рядків
Крім Left та right параметр aling може приймати наступні значення:
- top – верхня межа зображення вирівнюється по найбільш високому елементу рядка;
- texttop - верхня межа зображення вирівнюється по найбільш високому текстовому елементу рядка;
- middle - середина зображення вирівнюється по базовій лінії рядка;
- absmiddle – середина зображення вирівнюється по середині рядка;
- bottom - нижня межа зображення вирівнюється по базовій лінії рядка;
- absbottom - нижня межа зображення вирівнюється по нижній межі рядка.
В цих випадках зображення можна розглядати як звичайний елемент рядка.
Відзначимо, що базова лінія тексту – це нижня лінія рядка тексту без врахування нижної частини деяких символів (p,j,v)
