Пример
Карта изображений с кликабельными областями:
<img src="workplace.jpg" alt="Рабочее место" usemap="#workmap" width="400"
height="379">
<map name="workmap">
<area shape="rect"
coords="34,44,270,350" alt="Компьютер" href="computer.htm">
<area
shape="rect" coords="290,172,333,250" alt="Телефон" href="phone.htm">
<area shape="circle" coords="337,300,44" alt="Чашка кофе" href="coffee.htm">
</map>
Попробуйте сами »
Определение и использование <map>
Тег в HTML <map> используется для определения карты изображений. Карта изображений - это изображение с кликабельными областями.
Атрибут name обязателен для элемента <map>, связан с атрибутом usemap и создает связь между <img> и картой.
Элемент <map> содержит ряд элементов, определяющих кликабельные области <area> на карте изображений.
Поддержка браузеров <map>
| Элемент | |||||
|---|---|---|---|---|---|
| <map> | Да | Да | Да | Да | Да |
Атрибуты <map>
| Атрибут | Значение | Описание |
|---|---|---|
| name | mapname | Требуемый. Задает имя карты изображений |
Глобальные атрибуты <map>
Тег <map> также поддерживает Глобальные атрибуты в HTML.
События атрибутов <map>
Тег <map> также поддерживает События атрибутов в HTML.
Еще примеры <map>
Пример
Еще одна карта изображений, с кликабельными областями:
<img src="planets.gif"
width="145" height="126"
alt="Планеты"
usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Солнце">
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Меркурий">
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Венера">
</map>
Попробуйте сами »
Связные страницы <map>
HTML DOM справочник: Объект map
Настройки CSS по умолчанию <map>
Большинство браузеров будут отображать элемент <map> со следующими значениями по умолчанию:
map {
display: inline;
}