HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML: <map> 태그

HTML <map> 태그는 클릭 가능한 영역(또는 핫스팟)을 가진 이미지 맵을 정의합니다. <map> 태그 내에서, <area> 태그를 사용하여 클릭 가능한 영역을 생성할 수 있으며, 각 클릭 가능한 영역은 관련한 히퍼링크를 가질 수 있습니다. 이 태그는 일반적으로 <area> 요소로도 알려져 있습니다.

온라인 예제

클릭 가능한 영역을 가진 이미지 맵:

예제

!DOCTYPE html>
<html>
<head>　
<meta charset="utf-8">　
<title>기본 강의 웹(oldtoolbag.com)</title>　
</head>
<body>
<img src="planets.gif" width="145"height="126"alt="행성" usemap="#planetmap">
　
<map name="planetmap">
　　<area shape="rect" coords="0,0,82,126"alt="태양" href="sun.html">
　　<area shape="circle" coords="90,58,3"alt="水星" href="mercur.html">
　　<area shape="circle" coords="124,58,8"alt="金星" href="venus.html">
</map>
</body>
</html>

테스트 봐 보세요 ‹/›

브라우저 호환성

IEFirefoxOperaChromeSafari

현재 대부분의 브라우저가 <map> 태그를 지원합니다.

태그 정의 및 사용 설명

<map> 태그는 클라이언트 이미지 맵을 사용합니다. 이미지 맵은 클릭할 수 있는 영역을 가진 이미지입니다.

<img> 태그의 usemap 속성은 <map> 태그의 name 속성과 동일해야 하며, 이 두 요소 간의 관계를 구축합니다.

area 요소는 항상 map 요소 내부에 포함됩니다. area 요소는 이미지 맵 내의 영역을 정의할 수 있습니다.

HTML 4.01 HTML과5간의 차이

주의: HTML에서5 중에서, id 속성이 <map> 태그에 지정되면, name 속성도 동시에 지정되어야 합니다.

HTML과 XHTML 간의 차이

XHTML에서 name 속성은 폐지되었으며, id 속성으로 대체되었습니다.

속성

속성	값	설명
name	mapname	필수입니다. image-map가 정의한 이름.

전역 속성

<map> 태그는 전역 속성을 지원하며, 전체 속성 테이블을 확인하세요 HTML 전역 속성。

이벤트 속성

<map> 태그는 모든 이벤트 속성을 지원합니다 HTML 이벤트 속성。

HTML: <main> 태그 HTML: <link> 태그