如何删除 angular material 中底部 sheet 令人讨厌的点击覆盖？

Question

这是问题所在：我在我的 angular 12 应用程序中添加了来自 angular material 的底页。除了在移动设备 phone 上，它运行良好，每次点击它都会添加一个蓝色的覆盖层，这很烦人，我从 material 网站上复制过去...有人知道怎么回事吗？

旁注，我确实添加了 primeng，也许是 primeng 的问题？

这里有动画图片供参考（图片） Click to see the picture on imgur

Answer 1

尝试将此添加到元素的 scss 或 css。

-webkit-tap-highlight-color: transparent;

或

-webkit-tap-highlight-color: rgba(0,0,0,0);

如果需要，可以全局添加

* {
-webkit-tap-highlight-color: transparent;
}

对于某些版本，这个或与上面的组合都可以。

:focus {
    outline: none!important; /* no outline - for most browsers */
    box-shadow: none; /* no box shadow - for some browsers or if you are using Bootstrap */
}

如何删除 angular material 中底部 sheet 令人讨厌的点击覆盖？

How to remove the annoying click overlay on bottom sheet in angular material?

angular-material

angular