HTML의 태그 사용에 대한 자세한 설명
1, 영역 태그: 이미지 map에서 작업 영역을 구분합니다. 이 태그를 통해 이미지 맵에 작업 영역(핫스팟이라고도 함)을 설정할 수 있으므로 사용자가 마우스를 지정된 위치로 이동할 수 있습니다. 작업 영역을 클릭하고 자동으로 위치 지정을 위한 사전 설정 페이지로 연결됩니다.
2, Area> 태그: 나누는 영역은 이미지 맵의 영역 내에 있어야 하므로 태그를 사용하여 영역을 나누기 전에 다른 HTML 태그인
기본 구문 구조는 다음과 같습니다.
<area class=type id=Value href=url alt=text shape=area-shape coods=value>
shape 및 coords: 핫스팟의 모양과 크기를 설정하는 데 사용되는 두 가지 주요 매개변수입니다. 기본 사용법은 다음과 같습니다.
<area shape="rect" coords="x1, y1,x2,y2" href=url>表示设定热点的形状为矩形,左上角顶点坐标为(X1,y1),右下角顶点坐标为(X2,y2)。 <area shape="circle" coords="x1, y1,r" href=url>表示设定热点的形状为圆形,圆心坐标为(X1,y1),半径为r。 <area shape="poligon" coords="x1, y1,x2,y2 ......" href=url>表示设定热点的形状为多边形,各顶点坐标依次为(X1,y1)、(X2,y2)、(x3,y3) ......。
표시는 이미지 맵에서 동작 영역을 나누는 데 사용되므로, 나누는 동작 영역은 이미지 맵의 영역 내에 있어야 합니다. 이므로 영역을 나누기 위해 태그를 사용하기 전에 사용해야 합니다. 또 다른 HTML 태그인
다음은 이 두 태그의 사용법을 보여주는 예입니다.
여기에 새 책장의 사진이 있습니다. 효과는 다음과 같습니다. 책 "웹사이트 디렉토리"를 마우스로 클릭하면 새 창이 열립니다. , 이 책에 대한 소개 및 주문 웹페이지(urlall.htm)가 표시됩니다. 책 "웹사이트 디자인 가이드"를 마우스로 클릭하면 이에 대한
소개 및 주문 웹페이지가 표시되는 새 창이 열립니다. 책(urlall.htm) siteall.htm), 책 "웹 페이지 기술 백과사전"을 마우스로 클릭하면 책 소개와 주문 웹 페이지(pagejqlall.htm)가 표시되는 새 창이 열립니다. 제작 방법: 이미지를 삽입하고, 이미지의 관련 매개변수를 설정하고, 태그에 usemap="newbook" ismap 매개변수를 설정하여
를 나타냅니다.
표시를 사용하여 세 권의 책 위치에 대해 세 개의 직사각형 작업 영역을 나눕니다. 링크 매개변수 href 를 설정합니다.
1 <img src="image/htmlp3.gif" width="207" height="148" alt="新书架" hspace="10" align="left" usemap="#newbook" border="0"> 2 <map name="newbook"> 3 <area shape="rect" coords="56,69,78,139" href="urlall.htm" target="_blank" alt="这里收集十万多个网址。" title="这里收集十万多个网址。"> 4 <area shape="rect" coords="82,70,103,136" href="siteall.htm" target="_blank" alt="网站设计师的启蒙读本。" title="网站设计师的启蒙读本。"> 5 <area shape="rect" coords="106,68,128,136" href="pageall.htm" target="_blank" alt="网页制作者不可不读的书。" title="网页制作者不可不读的书。"> 6 </map>
이 글에 소개된 효과를 만들 때 주의해야 할 사항은 다음과 같습니다.
태그에 usemap 및 ismap 매개변수를 설정하는 것을 잊지 마세요. usemap의 매개변수 값은 동일해야 합니다.
동일한 "이미지 맵"의 모든 핫스팟 영역은 이미지 맵의 범위 내에 있어야 합니다. 즉, 모든 태그는
태그의 코드 매개변수로 설정된 좌표 형식은 다음과 같이 설정한 작업 영역의 모양과 일치해야 합니다. 모양 매개변수를 사용하여 모양 매개변수로 설정한 직사각형 동작 영역에는 나타나지 않는 반면, 코드에서는 다각형 영역의 꼭지점 좌표가 에 설정되는 현상이 나타납니다.
위 내용은 HTML의 태그 사용에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

핫 AI 도구

Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool
무료로 이미지를 벗다

Clothoff.io
AI 옷 제거제

AI Hentai Generator
AI Hentai를 무료로 생성하십시오.

인기 기사

뜨거운 도구

메모장++7.3.1
사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경

드림위버 CS6
시각적 웹 개발 도구

SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)

뜨거운 주제











HTML의 테이블 테두리 안내. 여기에서는 HTML의 테이블 테두리 예제를 사용하여 테이블 테두리를 정의하는 여러 가지 방법을 논의합니다.

HTML 여백-왼쪽 안내. 여기에서는 HTML margin-left에 대한 간략한 개요와 코드 구현과 함께 예제를 논의합니다.

HTML의 Nested Table에 대한 안내입니다. 여기에서는 각 예와 함께 테이블 내에 테이블을 만드는 방법을 설명합니다.

HTML 테이블 레이아웃 안내. 여기에서는 HTML 테이블 레이아웃의 값에 대해 예제 및 출력 n 세부 사항과 함께 논의합니다.

HTML 입력 자리 표시자 안내. 여기서는 코드 및 출력과 함께 HTML 입력 자리 표시자의 예를 논의합니다.

HTML 순서 목록에 대한 안내입니다. 여기서는 HTML Ordered 목록 및 유형에 대한 소개와 각각의 예에 대해서도 설명합니다.

HTML에서 텍스트 이동 안내. 여기서는 Marquee 태그가 구문과 함께 작동하는 방식과 구현할 예제에 대해 소개합니다.

HTML onclick 버튼에 대한 안내입니다. 여기에서는 각각의 소개, 작업, 예제 및 다양한 이벤트의 onclick 이벤트에 대해 설명합니다.
