Тег <area>
Описание
HTML-тег <area> используется внутри элемента <map> для определения интерактивных областей на изображении-карте (<img usemap="#название_карты">). Этот тег позволяет создать кликабельные зоны на картинке, каждая из которых может вести на разные страницы или запускать различные события.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Карта изображения</title>
</head>
<body>
<h1>Интерактивная карта России</h1>
<!-- Изображение с картой -->
<img src="russia_map.png" alt="Карта России" width="700" height="400"
usemap="#regionMap">
<!-- Карта регионов -->
<map name="regionMap">
<!-- Московская область -->
<area shape="rect" coords="100,100,200,200" href="/moscow_region.html" alt="Московская область">
<!-- Ленинградская область -->
<area shape="circle" coords="300,300,50" href="/leningrad_region.html" alt="Ленинградская область">
</map>
</body>
</html>
Атрибуты
| alt | Альтернативный текст для области |
| coords | Координаты активной области |
| download | Предлагает скачать ресурс по ссылке |
| href | URL назначения области |
| hreflang | Язык связанного ресурса |
| media | Определяет устройство для оптимизации ресурса |
| ping | URL для уведомления при переходе |
| referrerpolicy | Управляет отправкой HTTP Referer |
| rel | Отношение между документами |
| shape | Форма области (rect, circle, poly, default) |
| target | Где открыть ссылку (_blank, _self и т.д.) |
| type | MIME-тип связанного ресурса |
| accesskey | Горячая клавиша для активации |
| class | CSS-класс для стилизации |
| dir | Направление текста (ltr/rtl) |
| id | Уникальный идентификатор |
| lang | Язык содержимого |
| style | Инлайновые CSS-стили |
| tabindex | Порядок перехода по Tab |
| title | Всплывающая подсказка |
| nohref | Указывает неактивную область (устарел) |
Поддержка браузерами
 |
 |
 |
 |
 |
|---|---|---|---|---|
| 1.0 | 1.0 | 2.0 | 1.0 | 1.0 |