Question

我在Photoshop中有一个图像，我想将其转换为导航图。我需要将各个部件作为按钮，但我不想剪掉每一件，并将其重新定位在html和css中。有没有办法拍摄图像并将其中的一部分指定到某个链接，然后对其他链接执行相同操作而不将图像分开？我有adobe Photoshop cs6所以我在编辑方面有灵活性。

非常感谢你帮我解决了这个问题好几天。

以下是图片的链接：http://picpaste.com/TheBestThingEver-DcyjrkW8.jpg

Answer 1

html中的map和area标记可让您完成此操作。一个例子就是这个链接http://www.htmlcodetutorial.com/images/images_famsupp_220.html

Answer 2

您可以使用图像地图。

概念： http://www.w3schools.com/tags/tag_area.asp

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap"> <!-- this name must match the 'usemap' name above -->
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>

如何： http://www.graphics.com/article-old/creating-web-page-mockups-and-image-maps-photoshop

切割一个图像并给每个部分一个链接

2 个答案: