📜  如何使用 HTML 将图像划分为不同的可点击链接区域?

📅  最后修改于: 2021-11-03 10:09:42             🧑  作者: Mango

可以使用以下方法将图像划分为不同的可点击和可链接区域 一个 图像映射图像地图用于导航目的。

一个图像地图由几个标签组成:

  • img:指定要包含在地图中的图像。
  • 地图:它创建可点击区域的地图。
  • area:它用于地图元素内部,用于定义可点击区域。

我们可以制作以下形状的区域:

  • circle:圆形区域
  • rect:矩形区域
  • poly:多边形区域
  • 默认值:任何定义形状之外的区域

例子:

 

 
     

HTML 代码:在以下示例中,我们将使用 矩形形状 作为 我们可以轻松地将矩形分成四个相等的部分。 COORDS属性的前两个值是(X,Y)的顶部坐标左上角。第三和第四个数字是(X,Y)右下角的坐标。

注意: (x, y) 坐标使用左上角作为原点 (0, 0)。

HTML


  
   
    

  

    

GeeksforGeeks

    

Creating 4 equal clickable areas in an image

    usemap                        GFG1          GFG2          GFG3           GFG4          


输出: