将 onclick link 事件添加到具有 CSS 的图像

Question

我有一张图片在悬停时会弹跳，但我希望用户也能够点击该图片并被带到另一个网站。我需要在我的代码中更改什么才能使其正常工作？

.my-custom-control { background: url('my-image.png'); 
background-size: 150px 150px;
background-repeat: no-repeat;
background-position: center;
background-clip: border-box;
transition: background-size 0.2s;
-webkit-transition: background-size 0.2s;
transition-timing-function: cubic-bezier(.05,1.2,.72,1.2);
display: inline-block; 
width: 200px; 
height: 200px; 
}
.my-custom-control:hover {
    background-size: 200px;
}

Answer 1

将您的图片包装到锚标记中...

<a href="http://www.yahoo.com"><img src="" class="my-custom-control"></a>

将 onclick link 事件添加到具有 CSS 的图像

Add onclick link event to an image with CSS

html

css

onclick