HTML <area> Тег

Пример:

<img src="planets.gif" width="145" height="126" alt="Planets"
usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map> 

Определение и использование

Тег <area> определяет участки на карте-картинке (и делает эти участки выделяемыми и кликабельными). Тег <area> всегда вложен в тег <map>.

Заметка: мы определяем картинку в теге <img> и связываем ее с тегом <map>, с помощью свойства usemap="" в котором указываем имя карты, которое в свою очередь описывается в теге <map> в свойстве name="".

 Совместимость с браузерами

Элемент          
<area> Да Да Да Да Да

Атрибуты

= New in HTML5.

Attribute Value Description
alt text Определяет альтернативный текст для карты. Является обязательным если есть значение в атрибуте
coords coordinates Определяет координаты для тега area, чтобы задать площадь
download filename Определяет путь к файлу для скачивания при клике на карте
href URL Определяет ссылку для перехода по клику на area
hreflang language_code Определяет язык
media media query Определяет для какого устройства сделана карта
nohref value Не поддерживается в HTML5.
Определяет что area не имеет ссылки
rel alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
Определяет связь между текущим документом и с тем на который идет ссылка
shape default
rect
circle
poly
Определяет начертания area
target _blank
_parent
_self
_top
framename
Определяет как будет открываться страница при переходе по area ссылке
type media_type Определяет для какого устройства сделана страница на которую ведет area

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

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

Атрибуты событий: 

Атрибуты событий

Добавить комментарий

Войти, используя Loginza Google Account Yandex Mail.ru Vkontakte Facebook
(If you're a human, don't change the following field)
Your first name.
(If you're a human, don't change the following field)
Your first name.

Plain text

  • HTML-теги не обрабатываются и показываются как обычный текст
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Строки и параграфы переносятся автоматически.