Для вставки картинки використовується тег IMG.

Його синтаксис:

<IMG SRC="ім'я файлу" ALT="текст" ALIGN=розташування HEIGHT =висота >,

де: атрибут src вказує шлях до файлу, який добавляється на Web-сторінку; атрибут alt описує альтернативний текст для зображення, цей текст відображається замість зображення, коли сам малюнок ще не показується або коли курсор миші перебуває над картинкою; атрибут align задає місце розташування зображення; атрибути width і height задають ширину та висоту зображення відповідно, значення цих атрибутів можуть задаватися в пікселях або відсотках розміру екрана.

Атрибут src є обов’язковим.

Атрибути alt, align, width, height є необов'язковими.

Атрибут align може мати наступні значення:

· top - наступний текст розташовується у верхній частині зображення;

· bottom - наступний текст розташовується в нижній частині зображення;

· left - зображення перебуває в лівій частині аркуша, текст обтікає зображення праворуч;

· middle - зображення перебуває в центрі аркуша,

· right - зображення перебуває в правій частині аркуша, текст обтікає зображення ліворуч.

Використовуючи атрибут ALIGN= із значеннями LEFT або RIGHT можна створити картинку, яку обтікатиме текст. В кінці об'єкту обов'язково повинна бути присутньою команда BR з атрибутом CLEAR=, який припиняє обтікання картинки. Після цієї команди текст виводиться нижче за графічний файл.

Розглянемо наступний приклад:

< IMG SRC=" picture. gif " ALIGN=LEFT HSPACE=4 > Тут розташовується текст, який слід помістити справа поряд з картинкою. Текст повинен обтікати картинку

< BR CLEAR=LEFT>Здесь розташовується текст, який слідує

помістити нижче за картинку.

Значення параметрів width і height, як вже відзначалось, вказуються як у пікселях, так і відсотках відносно розмірів вікна перегляду. Якщо завдана ширина й висота не збігаються з істинним розміром, то браузери виконують автоматичне перемасштабування. Якщо зазначено тільки один параметр, то другий буде обчислюватися автоматично. Якщо не потрібно змінювати розмір зображення, то краще вказати в параметрах width, HEIGHT реальний розмір у пікселях (визначити цей розмір можна за допомогою будь-якого растрового редактора).Масштабування може привести до різкого погіршення якості графічного файлу, тому рекомендується задавати розміри відповідні розмірам графічного файлу.

Рекомендується для великих графічних файлів (більше 10 Kb) завжди задавати їх розміри, для прискорення роботи браузера. Якщо розміри не задані, то зустрівши графічний файл браузер припиняє виведення тексту і чекає поки перекачається вся картинка, щоб визначити її розміри.

 

Атрибут ALT = указує, що ставити на місце малюнка, якщо ваш браузер не уміє показувати графічні файли або унаслідок повільної швидкості перекачування ви не отримали файл по мережі.

Якщо ви вставляєте команду IMG в документ, то браузер розміщує наступний за нею текст внизу від картинки.

 

Атрибут HSPACE= задає горизонтальний відступ між текстом і картинкою. Якщо даний атрибут не заданий, то текст розташовуватиметься впритул до картинки. Атрибут VSPACE = задає вертикальний відступ між текстом і картинкою).

Відділення зображення від тексту (атрибути hspace та vspase)

Параметр hspace – задає ширину (в пікселях) пустого поля справа та зліва від зображення.

Параметр vspase – визначає розміри (в пікселах) пустого поля зверху та знизу від зображення.

Рамки навколо зображення (атрибут border)

Параметр border – значення цього параметру визначає ширину рамки навколо зображення в пікселах.

Альтернативний текст (атрибут alt)

Параметр alt дає деяку інформацію про графічне зображення, якщо режим перегляду відключений (іноді він використовується як підказка).