将照片的一部分链接到另一个html页面

Question

我想链接html页面上的照片的一部分以重定向到我正在制作的另一个html页面。最简单的方法是什么？

<div class="large-8 columns"> 
    <div style="background-image: url('../BackgroundGrid.png')> 
     <div class="layer-wrapper"> 
      ... 
     </div> 
    </div> 
</div> 

因此，将BackgroundGrid图像的一个角落重定向到一个单独的html页面。 任何想法？

Answer 1

您可以通过这种方式创建一个透明

<a href="http://google.com" target="_blank"> 

对你的照片与CSS的顶部

（说你想要的一半上部件可以点击并链接到谷歌）：

.parent-wrapper{ 
    position: relative; 
} 

.photo-click-area { 
    position: absoulte; 
    top: 0; 
    left: 0; 
    height: 50%; 
    background: transparent; 
    display: block; 
    cursor: pointer; 
    z-index: 9; 
} 

所以你的代码可能看起来像这样：