我们已经了解了如何使用文本创建超文本链接，并且还学习了如何在网页中使用图像。现在，我们将学习如何使用图像创建超链接。

例

将图像用作超链接很简单。我们只需要在超链接内的文本位置使用图像，如下所示-

   
    
   
      
Click following link
       
          
      
   
    

这将产生以下结果，您可以在其中单击图像以到达Tutorials Point的主页。

这是使用图像创建超链接的最简单方法。接下来，我们将看到如何创建鼠标敏感图像链接。

鼠标敏感图像

HTML和XHTML标准提供了一项功能，使您可以在单个图像中嵌入许多不同的链接。您可以基于图像上可用的不同坐标在单个图像上创建不同的链接。将不同的链接附加到不同的坐标后，我们可以单击图像的不同部分以打开目标文档。这种对鼠标敏感的图像称为图像图。

有两种创建图像映射的方法-

• 服务器端图像映射-这由标记的ismap属性启用，并且需要访问服务器和相关的图像映射处理应用程序。

• 客户端图像地图-使用标签的usemap属性以及相应的

服务器端图像映射

在这里，您只需将图像放在超级链接中，并使用ismap属性即可使其成为特殊图像，并且当用户单击图像中的某个位置时，浏览器将鼠标指针的坐标以及标记中指定的URL传递给到网络服务器。服务器使用鼠标指针坐标来确定将哪个文档传递回浏览器。

使用ismap时，包含标记的href属性必须包含服务器应用程序的URL，例如cgi或PHP脚本等，以便根据传递的坐标来处理传入的请求。

   
    
   
      
Click following link
      
       
          
      
   
    

然后浏览器将以下搜索参数发送到Web服务器，该服务器可以由ismap.cgi脚本或地图文件处理，您可以将所需的任何文档链接到这些坐标-

/cgi-bin/ismap.cgi?20,30

这样，您可以将不同的链接分配给图像的不同坐标，并且在单击这些坐标时，可以打开相应的链接文档。要了解有关ismap属性的更多信息，可以查看如何使用图像ismap?

注意-学习Perl编程时，您将学习CGI编程。您可以使用PHP或任何其他脚本编写脚本来处理这些传递的坐标。现在，让我们集中精力学习HTML，稍后您可以重新访问本节。

客户端图像映射

客户端图像映射由标记的usemap属性启用，并由特殊的

将使用标记作为普通图像插入将要形成地图的图像，但该图像带有一个额外的属性，称为usemap 。 usemap属性的值是将在

map标记内的标记指定形状和坐标，以定义图像上可用的每个可单击热点的边界。这是图像映射的示例-

   
    
   
      
Search and click the hotspot
      
      
      
      
   
   

这将产生以下结果-

坐标系

坐标的实际值完全取决于所讨论的形状。这是一个摘要，后面是详细的示例-

• rect = x ₁ ，y ₁ ，x ₂ ，y ₂

  x ₁和y ₁是矩形左上角的坐标； x ₂和y ₂是右下角的坐标。

• 圆= x _c ，y _c ，半径

  x _c和y _c是圆心的坐标，而radius是圆的半径。以200,50为中心，半径为25的圆的属性coords =“ 200,50,25”

• poly = x ₁ ，y ₁ ，x ₂ ，y ₂ ，x ₃ ，y ₃ ，… x _n ，y _n

  各种xy对定义多边形的顶点(点)，并从一个点到下一个点绘制一条“线”。顶点为20,20且最宽点为40像素的菱形多边形将具有属性coords =“ 20,20,40,40,20,60,0,40” 。

所有坐标均相对于图像的左上角(0,0)。每个形状都有一个相关的URL。您可以使用任何图像软件来了解不同位置的坐标。