이미지 링크 / map, area

usemap 속성 : map 태그의 이름을 속성값으로 설정

 

<img alt="이미지 링크" src="/web/html/images/map.png" usemap="#favorites">

 

 

 

map 태그 

 

• 하나의 이미지에서 영역을 구분해 하이퍼링크 기능을 제공하기 위한 태그
• 하위태그 : area

• name 속성 : 태그의 이름을 속성값으로 설정

 

 

area 태그

 

• 이미지에서 영역을 설정하기 위한 태그

• shape 속성 : 영역을 구분하기 위한 도형을 속성값으로 설정 
  - 속성값 : rect(기본값-사각형), circle(원), poly(타원) 등
• coords 속성 : 영역을 구분하기 위한 도형의 좌표값을 속성값으로 설정 (좌표값은 그림판에서 쉽게 확인 가능하다.)

 

 

예시

 

<map name ="favorites">

<area alt="트위터" shape="rect" coords="0,0,129,117" href="https://twitter.com" target="_blank">