area태그는 map태그의 하위에 사용되며 이미지맵을 만들때 영역을 지정하고 링크 설정을 한다.
<!DOCTYPE html>
<html>
<head>
<title>area</title>
</head>
<body>
<img src="cat.jpeg" alt="고양이" usemap="#myMap">
<map name="myMap">
<area shape="circle" coords="300, 300, 100" href="http://www.naver.com" target="_blank" title="네이버">
<area shape="rect" coords="350, 500, 600, 800" href="http://www.daum.net" target="_blank" title="다음">
</map>
</body>
</html>
| Attribute | Value | Description |
|---|---|---|
| alt | text | 이미지 대체 문구 설정 |
| coords | coordinates | 영역의 좌표 설정 |
| download | filename | 클릭시 href로 연결된 파일 다운로드 설정 |
| href | URL | 연결될 파일 경로 설정 |
| hreflang | language_code | 연결될 파일 구성 언어 설정 |
| media | media query | 연결될 파일 최적 디바이스 종류 설정 |
| referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin same-origin strict-origin-when-cross-origin unsafe-url |
Specifies which referrer information to send with the link |
| rel | alternate author bookmark help license next nofollow noreferrer prefetch prev search tag |
Specifies the relationship between the current document and the target URL |
| shape | default rect circle poly |
영역의 모양 설정 |
| target | _blank _parent _self _top framename |
연결될 파일 오픈시 새 창 설정 |
| type | media_type | 연결될 파일의 형식 설정 |
반응형
'HTML' 카테고리의 다른 글
| aside 태그 (0) | 2021.01.04 |
|---|---|
| article 태그 (0) | 2021.01.03 |
| address 태그 (0) | 2021.01.01 |
| abbr 태그 (0) | 2021.01.01 |
| noscript 태그 (0) | 2020.12.31 |
