Html 背景图片上的链接

我想使用背景图片上的链接（参见示例）。我如何才能像文本“Link1”和“link2”所示，向该图片的部分（例如形状）添加链接？

您不能这样做，但有几种间接方式：

1。您可以使用分隔图像

2。在图像上添加一个索引低于图像的div

.getclick_link1 {
      /* Get the position and width of Link1 with F12 in Chrome */
      z-index : <put a z-index for the image> - 1;
      width : <the width of Link1> ;
      height : <the height of Link1>;
      position : absolute;
      left : <Get the left position of Link1 in the image>;
      top : <Get the top position of Link1 in the image>;
}

---

图像贴图不适用于背景图像。如果仍要处理背景图像，可以将透明图像绝对放置在背景图像上，并将其固定。为绝对定位的透明图像提供更高的z索引，使其可单击。

您可以使用HTML

map

tag（）或将div与背景图像放在容器中，并相应地定位它们……map标记如何适合css代码？示例html{background:url（'images/field.jpg'）无重复中心固定；-webkit背景大小：cover；-moz背景大小：cover；-o-background-size:cover；背景大小：cover；}html，正文{height:100%；width:100%；margin:0；}html地图标记；）所以它不在CSS中。。。（我不喜欢W3傻瓜，但看看这个关于可点击行星的小例子：）当然，但当图像仅在css中被引用时，我必须将对地图的引用放在哪里？不知道-我更喜欢其他解决方案（正确地将透明可点击元素放置在图像上方…）。。。

$(function(){
    $(".getclick_link1").click(function() {
        window.location = "The address you like to redirect"
    });
});