HTML 이미지 맵을 어떻게 작성합니까?
링크가 HTML (HyperText Markup Language)의 이미지에 추가되면 해당 링크가 전체 이미지에 추가됩니다. 프로그래머가 여러 영역이나 버튼이있는 단일 이미지를 만들고 각 영역이 다른 링크에 사용되는 경우 문제가 될 수 있습니다. HTML 이미지 맵을 사용하면 프로그래머가 링크가 진행되는 특정 영역을 지정하여 여러 링크를 하나의 이미지에 포함시킬 수 있습니다. 이는 링크의 모양을 지정하고 HTML에 링크에 어떤 좌표가 사용되어야하는지 알려줍니다.
인터넷에 사용되는 이미지는 픽셀로 측정됩니다. 이미지에 몇 개의 픽셀이 있는지 아는 것은 이미지 맵을 만드는 첫 번째 필수 단계입니다. 예를 들어, 높이가 400 픽셀이고 폭이 250 픽셀 인 직사각형 이미지가 사용됩니다. 다음으로 프로그래머는 HTML 이미지 맵의 좌표에서 모양을 정확하게 측정하는 방법을 알아야합니다.
t그는 HTML 이미지 맵을 사용할 때 왼쪽 상단을 0,0이라고 불립니다. 이 경우 오른쪽 하단 모서리는 250,400입니다. 측정은 먼저 너비와 높이로 이루어집니다. 그것을 생각할 수있는 쉬운 방법은 첫 번째 측정은 HTML에 왼쪽 가장자리에서 오른쪽으로 얼마나 멀리 떨어져 있는지 말하는 것입니다. 두 번째는 얼마나 많은 픽셀이 갈 수 있는지 알려주는 것입니다. 프로그래머가지도에서 포인트가 왼쪽 가장자리에서 10 픽셀이고 50 픽셀을 아래로 내려 가기를 원한다면 좌표는 10,50입니다.
프로그래머가 HTML 이미지 맵을 위해 호출 할 수있는 세 가지 다른 모양이 있습니다 : RECT, CIRLE 및 POLYGON. "ERT"는 사각형을 나타냅니다. 프로그래머는 먼저 왼쪽 상단 코너의 좌표를 입력 한 다음 오른쪽 하단을 입력해야합니다. 원이 시작되는 좌표를 입력 한 다음 원의 반경을 입력하여 원이 지정됩니다. 다각형은 상단에서 오른쪽으로 5 개의 좌표를 모두 입력하여 생성됩니다.
html 이미지 맵 코딩은 다음과 같습니다.
<지도 이름 = "">
테스트
<면적 href = "url.html"shape = rect coords = "10,50,20,60">
<면적 href = "url.html"shape = circle coords = "10,50,4">
각 HTML 이미지 맵에는 이름이 있어야하며 "url.html"섹션은 이미지 맵의 해당 섹션이 클릭 할 때 사용자를 이끌어내는 링크입니다. 이미지가 HTML과 함께 웹 사이트에 배치되면 프로그래머가 다음을 작성해야합니다. usemap = "테스트". 이것은 이미지에 어떤 HTML 이미지 맵을 사용할 것인지 알려줍니다.