Css 如何删除手机上按钮的蓝色突出显示？

我尝试删除按钮前面单击时出现的蓝色框，如下所示：

在提问之前，我做了很多研究，我尝试了以下主题给出的解决方案：

我已经试过了所有的答案！它可以在电脑上工作，但不能在手机上工作

如果您使用的是计算机，您可以尝试使用inspector模拟移动设备。这是按钮：

#添加{
-webkit框大小：内容框；
-moz框大小：内容框；
框大小：内容框；
大纲：无；
光标：指针；
填充：10px；
溢出：隐藏；
边界：无；
-webkit边界半径：50%；
边界半径：50%；
颜色：rgba（255，255，255，0.9）；
文本对齐：居中；
背景：#1abc9c；
-webkit盒阴影：0 4px 3px 2px rgba（0,0,0,0.2）；
盒影：0 4px 3px 2px rgba（0,0,0,0.2）；
}
#添加：活动{
不透明度：0.85；
-webkit盒阴影：2px2px0RGBA（0,0,0,0.2）；
盒影：2px2px0RGBA（0,0,0,0.2）；
}

您可以添加：

-webkit-tap-highlight-color: transparent;

您还可以将其添加到样式表中以全局定义：

input,
textarea,
button,
select,
a {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

希望这有帮助：）

您可以在此处找到文档以了解更多信息：

*{
-webkit点击突出显示颜色：透明；
}

---

测试它。

如果您从

#添加
选择器中删除
光标：指针
，则将不会突出显示（至少在Chrome 88+中）。如果您需要在“桌面”模式下使用它，请使用以下内容：

@media (min-width: 768px) {
    #add {
        cursor: pointer;
    }
}

您的示例对我来说很好。其他服务提供商是否有其他供应商前缀？这标准化了吗？救了我一天！谢谢。别忘了最后添加div:）！这就是我想要的-谢谢你这里有很多大于768px的移动屏幕，它不会对这些屏幕产生任何影响。