css - 在带有触摸屏的设备上禁用 CSS 规则

我在我的网站上使用这个面包屑脚本：

当我将鼠标悬停在链接上时，会弹出一组子菜单。这工作正常，我对我的电脑没有任何抱怨。但是，您无法在移动设备上正确地将鼠标悬停，因此我想禁用在移动设备上弹出子菜单。

有没有办法在媒体查询中检测不依赖像素屏幕尺寸的移动设备？我这里的问题不是屏幕大小，而是输入法。谢谢。

标签： csstouch

有一个新的4 级媒体查询很可能成为实现此目的的方式。

真正的魔力是hover: hover，但这里有一些pointer: fine来自MDN的信息：

主要输入机制包括一个精确的指示设备。

您可以像这样使用查询：

@media(hover: hover) and (pointer: fine) {
  .navigation-main ul li:hover>ul {
    display:block;
  }
}