본문 바로가기

HTML

HTML <map> 태그

반응형

정의 및 특징

・<map> 태그는

 클라이언트 사이드 이미지맵(client-side image-map)을

 정의할 때 사용한다

 

・이미지맵(image-map)은

 클릭할 수 있는 영역을 가지는 이미지를 의미한다

 <area> 요소는 이러한 이미지맵의

 클릭할 수 있는 영역을 정의하는 데 사용되며

 <map> 요소는 하나 이상의 <area> 요소를

  포함할 수 있다

 

・<map> 요소의 필수 속성인 name 속성은

 <img> 요소의 usemap 속성과 결합하여

 이미지(image)와 맵(map) 사이의 관계를 설정한다

 

・HTML과 XHTML에서의 차이점

 XHTML에서는 name 속성을 더 이상 지원하지 않으므로

 name 속성 대신 전역 속성인 id 속성을 사용해야 한다

 

 

지원하는 브라우저

1.0 지원함 지원함 1.0 1.0 지원함

 

속성

속성명 속성값 설명
name 이름 필수 속성으로, 이미지맵의 이름을 명시한다

 

예제

<img src="/examples/images/img.jpg" alt="test" usemap="#test" width="320" height="240" />
<map name="test"> 
    <area coords="75,75,75" shape="circle" href="https://rusi0038.tistory.com/11" />
    <area coords="275,75,75" shape="circle" href="https://rusi0038.tistory.com/20" />
</map>
MDN infographic

 

 

■HTML 태그 레퍼런스
HTML 태그 레퍼런스 - MAIN 돌아가기

 

 

반응형

'HTML' 카테고리의 다른 글

HTML <meter> 태그  (0) 2023.07.14
HTML <mark> 태그  (0) 2023.07.13
HTML <main> 태그  (0) 2023.07.11
HTML <link> 태그  (0) 2023.07.10
HTML <li> 태그  (0) 2023.07.09