5

我有 - img id="logo" 所以我可以在我的网站上有我的徽标，它的完整代码是：

<img id="logo" src="nsc/logo2.png" alt="logo" />

如何使用<a href="">???链接此徽标图像

我尝试了许多不同的方法，但它们不起作用：/

4

7 回答 7

9 
<a href="www.example.com"><img id="logo" src="nsc/logo2.png" alt="logo" /></a>
于 2013-06-13T10:46:03.110 回答
2

嵌入链接标签会很好。:)

<a href="your.html">
    <img id="logo" src="nsc/logo2.png" alt="BrandLog" />
</a>

它很干净，不需要 javascript :)

于 2013-06-13T10:47:36.383 回答
1

这非常简单，只需<img>用锚标签包装标签<a>：

<a href="myUrl.html">
    <img id="logo" src="nsc/logo2.png" alt="logo" />
</a>

这会将整个图像变成您的链接:)

于 2013-06-13T10:46:55.520 回答
1

对于希望在a标签而不是img标签上接收点击事件的人

<a href="/chat" style="background: red; display: inline-block;">
  <img src="chat.svg" style="pointer-events: none; display: block;" width=40 height=40>
</a>

在a标签 上
  • display: inline-blockin a：允许在a标签上设置宽度和高度
在img标签 上
  • display: block：帮助删除图像下方的多余空间
  • pointer-events: none：忽略点击img，点击事件将在a标签上触发
于 2020-11-07T04:11:40.233 回答
0

如果您无法将图像包装在链接中，则图像映射应该也可以正常工作，而无需 JavaScript 并且无需包装元素。

于 2018-10-08T03:53:01.783 回答
0

我在 img 标签中添加 id，如下所示：

  <img id={logo.id} src={logo.url} onError={this.handleImageError} />

由于我正在研究 React，这就是我在 id 和 src 属性中使用 JSX 的原因。如果图像损坏，则使用 onError 属性。它给了我一个事件，所以这就是我访问 id 属性的方式：

handleImageError = (e) => { console.log(e.target.id) }
于 2020-05-07T12:22:39.270 回答
-6

这里有你的解决方案，

<img id="logo" src="nsc/logo2.png" alt="logo" onClick="window.open('http://yahoo.com');" />
于 2013-06-13T10:46:28.780 回答