<area> 태그의 coords 속성
HTML <area> 태그 ⇒
정의 및 특징
<area> 태그의 coords 속성은 이미지맵(image-map)에서 해당 <area> 요소의 좌표를 명시합니다.
coords 속성은 해당 <area> 요소의 크기와 모양, 배치 등을 명시하기 위하여 shape 속성과 함께 사용되며, 이때 해당 영역의 왼쪽 위 모서리(top-left corner)의 좌표는 언제나 (0,0)이 됩니다.
문법
<area coords=“좌푯값”> |
속성값
속성값 | 설명 | |
---|---|---|
x1,y1,x2,y2 |
사각형의 왼쪽 위 모서리(top-left corner)와 오른쪽 아래 모서리(bottom-right corner)의 좌표를 명시함. (단, shape 속성값이 “rect”인 경우에만 사용할 수 있음) |
|
x,y,반지름 |
원의 중심점 좌표와 반지름을 명시함. (단, shape 속성값이 “circle”인 경우에만 사용할 수 있음) |
|
x1,y1,x2,y2,...,xn,yn |
다각형의 각 모서리에 대한 좌표를 명시함. 만약 첫 번째 좌표쌍과 마지막 좌표쌍이 일치하지 않는다면, 브라우저가 자동으로 다각형을 닫기 위하여 마지막 좌표쌍을 추가함. (단, shape 속성값이 “poly”인 경우에만 사용할 수 있음) |
예제
<img src="/examples/images/img_imagemap.jpg" alt="진실 혹은 거짓" usemap="#vending" style="width:320px; height:240px">
<map name="vending">
<area shape="poly" coords="50,150,230,120,230,180,50,210" alt="진실" href="https://ko.wikipedia.org/wiki/%EC%A7%84%EC%8B%A4">
<area shape="circle" coords="140,100,40" alt="거짓" href="https://ko.wikipedia.org/wiki/%EA%B1%B0%EC%A7%93%EB%A7%90">
</map>
지원하는 브라우저 및 버전
속성명 | ||||||
---|---|---|---|---|---|---|
coords | 지원함 | 지원함 | 지원함 | 1.0 | 지원함 | 지원함 |