CSS 在移动设备上是否可以工作？

小开

最佳答案

:hover伪类需要一个指向(图形输入)设备，能够区分动作 指指点点和 选择/激活。通常在移动设备上有一个触摸界面，你没有前者，只有后者。此外，一些钢笔界面只允许激活，而不是指向。

当用户指定一个元素(带有一些指向设备)时，应用 :hover伪类，但不激活它。例如，当光标(鼠标指针)悬停在元素生成的框上时，可视化用户代理可以应用此伪类。不支持交互式媒体的用户代理不必支持这个伪类。一些支持交互式媒体的符合规范的用户代理可能不支持这个伪类(例如，钢笔设备)。

ー W3C: CSS 2.1: 选择器，动态伪类

所以，回答你的问题: 这取决于设备，但可能不是。不要依赖它。随着触摸屏设备迅速流行起来，你将失去所有只能指向的事件。

小开

它取决于移动设备中使用的浏览器。有关移动设备，请参考怪癖模式，看看您的浏览器/平台是否会实现它。

小开

我会说没有，因为你没有悬停在移动界面。如果在触摸屏上，你可以直接按下。否则，你只是通过链接移动。

小开

除非该设备能够检测到有人将手指悬停在屏幕上，准备点击。 :)

小开

虽然不能在触摸屏设备上施展魔法，但在用户使用箭头键(或亚马逊 kindle)进行导航的手机上确实可以使用

小开

也适用于黑莓风暴1设备，因为他们有触摸，点击事件，由于他们的 suedo 触摸屏幕。

小开

:hover与 android 默认浏览器一起工作，但是(对于用户)在不触发点击的同时触发鼠标悬停是非常棘手的。

小开

唉。似乎没有人回答这个问题实际上在一个真正的设备上试验过。在许多情况下，它确实有效。第一次点击作为一个悬停。

小开

从我个人的经验来看，它在我的 iphone4上运行良好，无论是浏览器(Safari 还是 chrome) ，但在我的 nexus10上运行不正常。

我使用 :hover来实现菜单。当我说“它工作”的时候，我的意思是第一次触摸就像是在桌面上悬停，第二次触摸就像是点击。当我说“它不工作”，我的意思是，触摸行为像一个点击直接..。

小开

提问者所说的“ css 是否在移动设备上工作?”是什么意思？

他显然不是字面上的意思，因为在移动设备上根本没有悬浮这种东西，所以它不能工作。

如果他的意思是“在移动设备上，如果我用鼠标悬停的方式点击一个物体，会发生什么事情吗?”答案是肯定的，但是发生的情况随着设备/浏览器的不同而不同。

特别是在 iPhone/Safari 和 Android 上，响应就好像你已经编写了一个带有样式更改的 OnClick ()事件处理程序，并且这种情况一直持续到你点击另一个对象为止。在 Windows 手机上，当你的手指按在手机上时，风格会发生变化，然后当你松开它时，风格会恢复。

您可以在我设置在 Davidleader.net/mobiledemo.html的测试站点检查您的设备。

小开

是的，它有。如果你不相信，尝试它。 I)在 Codepen 或其他你有帐户的堆栈上写悬停编码。 Ii)保存您的工作。[很容易看到，如果你添加’边框底部: 1px 虚线黑色’] Iii)在你的手机、平板电脑或者任何你想要证明的东西上打开它

因此，你会得到答案。不要太相信这个理论，只要实践并证明它就行了。