如何向图像链接添加简单反馈？

Question

我正在使用jQuery Mobile创建一个简单的静态应用程序。我使用图像链接到其他页面，但我意识到这使得用户没有视觉反馈。有没有办法（最好用CSS）我可以在点击链接时添加一些视觉反馈？

Answer 1

您可以为图片添加border或box-shadow，同时状态为焦点或有效。

例如：

＆＃13;

＆＃13;

.image{
  width: 100px;
  height: 30px;
  background: #777;
  border: 1px solid #222;
}

.image:focus, .image:active{
  box-shadow: 0 0 1px 1px #000;
}

＆＃13;

<a href="www.google.com" target="_blank"><div class="image"></div></a>

＆＃13;

＆＃13;

＆＃13;