Тег <area> обозначает активные области на картинке, которые работают как ссылки. Эти зоны могут принимать разные формы и размеры. Картинка с такими областями называется «карта-изображение». Она выглядит так же, как обычная картинка, но дополнительно содержит кликабельные участки. При перекрытии зон поверх будет та, которая указана в коде раньше (выше). Элемент <area> используется только внутри тега <map> как его потомок. Атрибуты - alt:
- Определяет альтернативный текст, который будет показан вместо изображения, если оно не загрузилось (из-за медленного соединения, ошибки в атрибуте
src и т.п.). - coords:
- Указывает координаты активной области на карте. Работает вместе с
shape: - x1,y1,x2,y2 - верхний левый и нижний правый угол прямоугольника (shape="rect").
- x,y,радиус - центр окружности и радиус (shape="circle").
- x1,y1,x2,y2,…,xn,yn - вершины полигона (shape="poly").
Примечание: координаты верхнего левого угла области – 0,0. - href:
- Указывает адрес страницы, куда ведёт ссылка. Если не указан, элемент
<area> просто становится невидимым (не гиперссылкой). (Адрес может быть абсолютным или относительным.) - hreflang:
- Двухбуквенный код языка целевой страницы. Используется только с
href и служит для информации. - media:
- Определяет тип документа или устройство, на которое рассчитана ссылка (например, мобильный телефон, принтер). Может принимать несколько значений и работает только с
href. - rel:
- Указывает отношение между текущим документом и связанным. Работает только с
href. - alternate - альтернативная версия (страница для печати, другая языковая версия).
- author - ссылка на автора.
- bookmark - постоянный URL для закладок.
- help - справочный документ.
- license - сведения об авторских правах.
- next - следующий документ.
- nofollow - не индексировать (Google «nofollow»).
- noreferrer - браузеру не посылать заголовок, если пользователь перешёл по ссылке.
- prefetch - кэшировать целевой документ.
- prev - предыдущий документ.
- search - ссылка на поиск.
- tag - ключевое слово текущего документа.
- shape:
- Определяет форму области. Работает вместе с
coords. - default - всю область изображения.
- rect - прямоугольник.
- circle - окружность.
- poly - многоугольник.
- target:
- Где будет открываться документ при переходе. Работает только с
href. - _blank - новое окно/вкладка.
- _parent - родительский фрейм.
- _self - в том же окне (по умолчанию).
- _top - во всю ширину окна.
- имя_фрейма - открывает в заданном iframe.
- type:
- Указывает MIME-тип целевого документа. Работает только с
href. Примечание: Атрибут usemap в теге <img> связан с атрибутом name элемента <map>, создавая связь между картинкой и её картой. Тег <area> поддерживает также ... Пример<img src="image.png" width="104" height="96" alt="numbers" usemap="#num1"><map name="num1"> <area shape="rect" coords="3,2,55,47" href="#" alt="kubik1"></map>
|