2

我不确定这是否可能。

有没有办法在图像的特定坐标上放置超链接?

前任

_____________________________________
|                                   |
|   xxx                             |
|   xxx                             |
|                                   |
|                                   |
|                                   |
|                    zzz            |
|                    zzz            |
|                                   |
|___________________________________|

有没有办法在 xxx 位置设置超链接,在图像的 zzz 位置设置单独的超链接。我将如何开始这个?

4

4 回答 4

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

<map name="planetmap">
<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>

有关 HTML coords 属性的更多信息 http://www.w3schools.com/tags/att_area_coords.asp

于 2012-10-16T06:21:12.610 回答
3

是的,它可以用<map>

<map name="a">
  <area shape="rect" coords="25,25,75,75" href='url'>
</map>
<img usemap="#a" src=image.png>
于 2012-10-16T06:21:03.400 回答
3

有很多方法可以解决这个问题。其他人已经提到使用 MAP,但听起来您可能意味着您想在图像上放置文本链接,而不仅仅是创建可点击区域。假设您想将链接定位在像素级别,一种方法如下所示:

<div id="myimagediv">
    <a id="linkxxx" href="xxx.example.com">xxx</a>
    <a id="linkzzz" href="zzz.example.com">zzz</a>
</div>

#myimagediv {
width: 150px;
    height: 100px;
    position: relative;
    background-image: url('myimage.jpg');
}
#myimagediv a {
    position: absolute;
}
#linkxxx {
    top: 10px;
    left: 10px;
}
#linkzzz {
    top: 70px;
    left: 70px;
}
于 2012-10-16T06:35:01.330 回答
0

这可以通过称为“图像映射”的过程来完成。这可能非常乏味,因为您必须逐个像素地映射它。互联网上有一些工具可以为您绘制图像。

于 2012-10-16T06:23:00.830 回答