Тег <map> указывает карту изображения на стороне клиента.

Карта изображения — это список координат, относящихся к конкретному изображению, созданный для гиперссылок некоторых частей изображения (в отличие от обычной ссылки на изображение, в которой вся область изображения связана с одной ссылкой).

Например, на карте мира каждая страна может быть связана с дополнительной информацией об этой стране. Цель карты изображений — обеспечить простой способ связывания различных частей изображения без разделения изображения на отдельные файлы.

Тип: Inline
Контент: Блочный и <area>
Открывающий тег: Обязательный
Закрывающий тег: Обязательный
Версия: HTML 3.2, 4, 4.01, 5

Синтаксис

Базовый синтаксис тега <map> выглядит следующим образом:

HTML / XHTML: <map name="text"> ... </map>

Примеры написания кода тега <map>:

<img src="shapes.png" usemap="#shapes" alt="Geometrical Shapes">
<map name="shapes">
    <area shape="circle" coords="40,40,40" href="circle.html" alt="Circle">
    <area shape="poly" coords="148,2,104,80,193,80" href="triangle.html" alt="Triangle">
    <area shape="rect" coords="226,2,323,80" href="rectangle.html" alt="Rectangle">
    <area shape="poly" coords="392,2,352,32,366,80,418,80,432,32" href="pentagon.html" alt="Pentagon">
</map>

Изображение может быть связано с картой изображения через атрибут usemap. Атрибут usemap, если он указан, должен быть строкой, начинающейся с символа хештега (#), за которым следует значение атрибута name элемента <map>.

Специальные атрибуты тега

В следующей таблице приведены атрибуты, которые относятся к тегу <map>:

Атрибут Значение Описание
name text Присваивает имя карте изображения.

Глобальные атрибуты

Как и все другие HTML-теги, тег <map> поддерживает все глобальные атрибуты в HTML5.

Атрибуты для событий

Тег <map> так же поддерживает атрибуты событий в HTML5.

Поддержка браузеров

Тег <map> поддерживается во всех основных браузерах.

Читайте также

Похожие посты

HTML-тег <header>

Определяет заголовок документа или раздела

HTML-тег <base>

Определяет базовый URL для всех связанных объектов на странице

HTML-тег <legend>

Определяет заголовок для элемента <fieldset>

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.