1

我正在为 Android 设备构建一个 Cordova 应用程序。有件事让我很困扰：每次点击可点击元素时，都会显示半透明的橙色背景和橙色轮廓。

以下屏幕截图显示了这种烦人的行为。在左侧，正在触摸一个样式化的 DIV 元素；在右侧，具有相同样式的 DIV 元素处于正常状态。

左侧：被触摸； 右手边：不活动；

经过一些在线研究，包括阅读有关 StackOverflow 的一些问题，我能够使用-webkit-tap-highlight-colorCSS 属性删除中间的橙色突出显示。

但是，较深的橙色轮廓（带圆角）仍然存在。我还尝试了以下 CSS：

*, *:focus, *:active, *:hover{
    -webkit-touch-callout: none;
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    outline: rgba(0, 0, 0, 0);
}

尽管如此，每当我触摸任何可点击的元素时，都会出现轮廓。

很奇怪，我发现文本选择和触摸标注也没有被阻止。只能-webkit-tap-highlight-color从上述 CSS 中按预期工作。

更新

我已经在以下设备上测试了该应用程序：

我发现轮廓不会只在小米手机 2 和 2S 上消失。我猜这是因为这些设备上的默认浏览器（或者更准确地说，在安装的 MIUI ROM 上）与现有 Android 中的浏览器不同。

不过，我正在寻找一种方法来解决这个问题，如果有的话。

4

0 回答 0