HTML의 이미지 맵에서 영역을 정의하려면 태그를 사용하세요.
HTML 태그는 다음 추가 속성을 지원합니다 -
| 속성 | 값 | 설명 |
|---|---|---|
| Alt | 텍스트 | 영역에 대한 대체 텍스트를 지정합니다. |
| 좌표 | 모양 ="직사각형"이면 좌표 ="왼쪽, 위쪽, 오른쪽, 아래쪽" if shape ="circ" then coords ="centerx, centery, radius" 모양 ="폴리"이면 좌표 ="x1, y1, x2, y2,..,xn, yn" | 이미지 맵에 대한 이미지 영역을 정의하기 위해 shape 속성에 적절한 좌표를 지정합니다. |
다운로드  | 파일 이름 | 사용자가 하이퍼링크를 클릭할 때 대상이 다운로드되도록 지정합니다. |
| Href | URL | 페이지의 URL 또는 링크가 이동하는 앵커의 이름을 지정합니다. |
hreflang  | 언어 코드 | 대상 URL의 언어를 지정합니다. |
미디어  | 미디어 쿼리 | 대상 URL이 최적화된 미디어/장치를 지정합니다. |
| Nohref | 참/거짓 | 이미지 맵에서 영역 제외 |
rel  | 대체 작가 서표 돕다 특허 다음 노팔로우 추천인 프리페치 이전 검색 꼬리표 | 현재 문서와 대상 URL 간의 관계를 지정합니다. |
| 모양 | 직사각형 직사각형 원 원 | 이미지 맵의 모양을 지정합니다. |
| | 폴리 다각형 | |
| 대상 | _blank _부모의 _본인 _맨 위 | 대상 URL을 열 위치입니다. _blank - 대상 URL이 새 창에서 열립니다. _self - 타겟 URL은 클릭했을 때와 같은 프레임에서 열립니다. _parent - 대상 URL이 상위 프레임셋에서 열립니다. _top - 창의 전체 본문에서 대상 URL이 열립니다. |
유형  | mime_type | 대상 URL의 MIME(Multipurpose Internet Mail Extensions) 유형을 지정합니다. |
예시
다음 코드를 실행하여 태그 −
를 구현할 수 있습니다.<!DOCTYPE html> <html> <head> <title>HTML area Tag</title> </head> <body> <img src = /images/usemap.gif alt = "usemap" border = "0" usemap = "#tutorials"/> <map name = "tutorials"> <area shape = "poly" coords = "74,0,113,29,98,72,52,72,38,27" href = "/perl/index.htm" alt = "Perl Tutorial" target = "_blank" /> <area shape = "rect" coords = "22,83,126,125" alt = "HTML Tutorial" href = "/html/index.htm" target = "_blank" /> <area shape = "circle" coords = "73,168,32" alt = "PHP Tutorial" href = "/php/index.htm" target = "_blank" /> </map> </body> </html>