생활 웹디자인

area

토픽 생활 웹디자인 > 구조의 HTML > HTML5 태그 사전

정의

area요소는 이미지맵의 영역을 지정하기 위한 요소입니다.

속성

  • shape : 영역의 형태를 지정합니다.
    • default : 화면전체
    • rect : 사각형
    • circle : 원형
    • poly : 다각형
  • coords : 영역의 좌표를 지정합니다.
    • shape속성값이 rect일때 : 왼쪽위의 XY좌표와 오른쪽아래 XY좌표
    • shape속성값이 circle일때 : 중심의 XY좌표와 반경
    • shape속성값이 poly일때 : 첫번째 각의 XY좌표, 두번째각의 XY좌표, 세번째각의 XY좌표
  • href : 해당영역 클릭시 이동할 주소를 지정합니다.
  • alt : 영역을 설명할 대체 텍스트를 지정합니다.

설명

  • href속성을 갖는다면 alt 속성을 반드시 사용하는것이 좋습니다. 반대로 href속성을 갖지 않는다면 alt속성역시 반드시 생략되는것이 좋습니다.

함께 알아두면 좋은 태그

예제

(강아지의 눈과 코에 마우스를 올려보세요)

댓글

댓글 본문
  1. 김민수
    브라우저의 문제가 아니라 운영하시는 분 서버의 문제거나 또는 문서를 작성했던 다른 웹사이트와의 링크가 끊어지거나 없어져서 그런겁니다.
    대화보기
    • 김수정
      익스에서도 크롬에서도 예제가 블랙화면에 404 That page doesn't exist. 라고 나와요~ 예제 보고싶습니다!
    • 박다은
      예제가 안나옵니다..ㅜㅜ
    • 푸른하늘
      1
    • map의 하위속성이라 생각해도 될까요?
    • oelps
      alt 는 이미지가 안 나올때 대체적으로 나오는 텍스트이고
      님이 말씀하시는거는 area 에 title="눈" 요런식으로 쓰시면 될거 같네요..^^
    • Hun Cheol Ha
      저는 마우스 올려도 눈, 코 같은 대체 설명텍스트가 안나옵니다; 크롬인데;;
    • 지나가던
      감사합니다^^