html - css 悬停样式和 iOS

Question

我正在开发一个 Web 应用程序，您可以在其中从一系列按钮中选择内容。当您将鼠标悬停在它们上面时，这些按钮的样式会发生变化。我将此样式包装在 @media 查询中，以便在移动设备上没有悬停样式:@media not all and (pointer: coarse)。

我使用 Chrome 开发人员工具进行了测试，它允许您在桌面上看到网站的移动显示，并且一切正常。部署我的更改后，有人在他们的手机上查看它，提示他们无法再取消选择按钮。但是，在更新到最新的 iOS(我相信是 13)之后，这个问题就为他解决了。我已经检查了我的个人 iPhone (iOS 12.4.1)，这个问题对我来说是存在的。

此外，我询问过的一位 Android 用户没有遇到此问题。

早期版本的 iOS 和移动 css 样式是否存在问题？

Answer 1

默认情况下，iOS 样式按钮。也许问题源于那里。要覆盖它，您可以使用此 CSS:

button {
-webkit-appearance: none;
border-radius: 0;
}