如何在图像的特定点添加链接？

Question

我有以下图像，我想在购物篮图标上添加链接。这怎么可能？

感谢您的回答。现在我有两种方法可以做到这一点或使用html：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">



<p style="font-weight:normal;text-transform:uppercase;color:#FFD700;background-color:#000000;border: 5px ridge #ababab;letter-spacing:4pt;word-spacing:-3pt;font-size:42px;text-align:center;font-family:georgia, serif;line-height:4;margin:0px;padding:0px;width:100%;height:183px;">New Online Shop <a href="https://frix-cy.com/shop/"><i class="fa fa-shopping-cart " aria-hidden="true"></i></a>

</p>

或者使用图像上的html shape 属性使用 @blue 答案：

 <img src='https://i.stack.imgur.com/5I8q6.jpg' width='500' height='150' usemap='#basket' />
    <map name='basket'>
        <area shape='rect' coords='440 50 500 100' href='www.your_link.com' alt='basket_icon' />
    </map>
    <p>Click on the basket</p>

Answer 1

尝试使用地图和区域来选择图像上的特定区域

超文本标记语言

   <img src='https://i.stack.imgur.com/5I8q6.jpg' width='500' height='150' usemap='#basket' />
    <map name='basket'>
        <area shape='rect' coords='440 50 500 100' href='www.your_link.com' alt='basket_icon' />
    </map>
    <p>Click on the basket</p>

我希望这有帮助！