Якщо тег <img> з ім'ям файлу малюнка розмістити між тегами <a> i </a>, то з цим малюнком буде пов'язане одне гіперпосилання. Можна зробити по іншому: поділити малюнок на області і кожну з них перетворити на гіперпосилання.
Такі області називають гарячими, а повне зображення - картою посилань. Вказівник миші після наведення на таку гарячу область набуває форми руки, як і у випадку текстових гіперпосилань.
Гарячі області можуть бути прямокутними, багатокутними або круглими. Слід подбати про те, щоб гарячі області не перетиналися. Для того, щоб відвідувач сайту зрозумів, що це карта посилань, а не просто красива картинка, необхідно дати пояснювальні тексти.
Формування карти посилань
Графічну карту посилань створюють за допомогою кількох тегів. У тегу <img> визначають атрибут src, щоб задати зображення і атрибут usemap, значення якого є ім'я карти (має починатися символом #).
Власне карту створюють за допомогою тега <map> з атрибутом name, який містить ім'я карти, визначене в атрибуті usemap, але без символу # та тегу </map>. Між ними записують теги <area>, які задають параметри гарячих областей. При цьому використовують такі атрибути:
HREF - визначає гіперпосилання, пов'язане з областю;
SHAPE - визначає форму області, його значення можуть бути:
rect - прямокутник;
polygone або poly - багатокутник;
circle - коло;
COORDS - містить координати області у вигляді взятого в лапки списку чисел, розділених комою.
Для прямокутника задають чотири числа - координати верхнього лівого і правого нижнього кутів, для багатокутника - послідовні координати кожного кута, для кола - координати центра і радіус.
Наприклад:
Фото, що буде слугувати картою посилань може бути довільним. Координати областей можна визначити в графічному редакторі, наприклад у Paint
Приклад коду
Приклад можна завантажити за посиланням --> Завантажити папку з прикладом
Завдання
Користуючись зразком, створіть веб-сторінку, що містить карту посилань (хочаб 2 посилання).