图像的超链接部分

Question

您好，我正在尝试将图像的某些部分超链接到不同的网页。

图片是一张地图，所以点击不同的部分，应该把它带到相关的网页。 我只想使用 HTML5 和 CSS3。

任何帮助将不胜感激。

图片链接如下。

Floor Plan

Answer 1

扩展我上面的评论，您可以为此使用image maps。您可以使用许多在线图像地图生成器来定义坐标（例如image-maps.com）。这是使用您提供的图像的示例：

<img src="http://i.stack.imgur.com/9Gecp.jpg" usemap="#linkmap" />

<map name="linkmap">
  <area  alt="board-games" title="Board Games" href="boardgames.html" shape="rect" coords="17,86,188,214" style="outline:none;" target="_self"     />
  <area  alt="lego-models" title="Lego Models" href="lego-models.html" shape="rect" coords="130,256,367,372" style="outline:none;" target="_self"     />
  <area  alt="playing-cards" title="Playing Cards" href="playing-cards.html" shape="rect" coords="261,110,377,197" style="outline:none;" target="_self"     />
</map>