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