html - 当在移动设备上单击时，spritesheet 图像会在其周围显示灰色框

Question

我创建了一个 spritesheet；在桌面上一切正常。但是，然后我尝试在我的 iPhone 5s 上查看它，它显示正常，但是当单击图像时，会立即出现一个深灰色框。我立即想到也许我有冲突的 CSS，但进一步研究发现当我尝试点击任何 Sprite 图像时会发生这种情况:

示例站点: http://css-tricks.com/examples/FadeImageWithSprite/

当任何按钮在它们改变颜色之前被点击时，会出现灰色框。希望有人能帮帮我

Answer 1

灰框是touch-click事件的通知，类似pseudo::active。

您可以通过将此 css 属性添加到按钮、a、类、id 或标签来更改颜色。

黑色不透明度为 0.3 或不透明度为 0 以使其不可见的示例。

body{
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
}