>웹 프론트엔드 >CSS 튜토리얼 >코디 (HTML 속성)

코디 (HTML 속성)

Lisa Kudrow
Lisa Kudrow원래의
2025-02-26 09:40:09356검색

요소 내부에 중첩 된 속성을 ​​사용하면 클라이언트 측 이미지 맵을 만들 수 있습니다. 이는 coords와 함께 <a></a> 요소를 사용하는 것과 유사한 이미지 내에서 클릭 가능한 영역을 제공합니다. 차이점과 <object></object> <area> 이미지 맵 예 : <map></map> <:>이 이미지를 고려하십시오 : coords

메소드 1 : 사용 요소 사용 (전통적인 이미지 맵) :

이 접근법은 클릭 가능한 영역을 정의하기 위해 a

내의

요소를 사용합니다.

메소드 2 : (대체 접근법) 내에서 요소를 사용합니다 이 메소드는 를 사용하여 이미지를 포함시키고 및 coords (HTML attribute) : 를 사용하여 링크를 내부에 배치합니다.

는 적절한 <area> 지원이없는 브라우저에 폴백 컨텐츠를 제공합니다.

속성 값 :

<area> 속성 값은 <map></map> 속성에 따라 다릅니다

<code class="language-html"><img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/174053401375600.png" class="lazy" alt="coords (HTML attribute) ">
<map name="Map">
  <area shape="rect" coords="132,117,270,185" href="https://www.php.cn/link/cf57d08a994170907f4f367c647e075e" alt="Monday's mustache - 'The Hero'">
  <area shape="poly" coords="136,238,137,301,3,306,3,242" href="https://www.php.cn/link/206f6a7ada917912e9389da75d80be3b" alt="Thursday's mustache - 'The Weasel'">
</map></code>
(사각형) :

(왼쪽 X, 왼쪽 왼쪽 y, 오른쪽 하단 X, 오른쪽 하단 Y 좌표). <a></a> (원) : <object></object> (중심 X, 중심 Y, 반경)

(다각형) :

<object></object> (X, Y 조정은 다각형의 정점을 정의하는 일련의 X, y 좌표). <a></a> coords 자주 묻는 질문 (FAQ) : shape 제공된 FAQ 섹션은 이미 포괄적이며

속성의 사용 및 제한을 정확하게 설명합니다. 변경이 필요하지 않습니다.

위 내용은 코디 (HTML 속성)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.