圆形图片链接答案

【问题标题】：Round Image Link圆形图片链接
【发布时间】：2017-06-03 08:01:37
【问题描述】：

我正在建立一个网站，我想添加一个指向 facebook 页面的链接。设计师给我发了一张圆形图片来代表 Facebook 链接。实际上，图像是一个矩形，但画是圆形的。我想要的是只有在图像的圆形区域上才能更改为“链接手”的指针。我可以通过以下方式部分实现：

.imgFacebook {    
    border-radius:50%;
    height:50px;    
}

但是我得到的结果是：它适用于图像的顶部。在顶部，当我将鼠标移到圆外时，指针回到箭头。底部仍然将图像视为方形图像，并将圆形设计外的指针更改为“手”，代表一个链接。我试图为每个角（左上/右和左/右下）单独设置边框半径，但没有成功。那么，有谁知道我怎样才能在我的图像中获得一个圆形区域作为链接？提前致谢

【问题讨论】：

标签： asp.net image hyperlink

【解决方案1】：

在使用不同的关键字进行一些搜索后，我能够在此链接中找到“操作方法”。 http://jsfiddle.net/6UYTL/2/ 我只需要在 div 中添加图像。至于图片，我也使用了一些样式使其显示为圆形。

<a href="http://www.wherelionsroam.co.uk" target="_blank">
    <div id="a">
        <asp:Image ID="imgLinkFacebook" runat="server" CssClass="imgFacebook"/>
    </div>
</a>

.imgFacebook {    
    border-radius:50%;
    height:50px;    
}

还是谢谢。

【讨论】：