CSS移动设备媒体查询独立于宽度

Question

我正在使用dragscroll插件来浏览一些内容，但由于某种原因，我很久没想到dragscroll在移动设备上无效了。

澄清一下：对于移动设备，我指的是没有鼠标光标但带有触摸屏（手机和桌子）的设备。

容器的规则是overscroll: hidden，但我需要将其设置为overscroll: auto移动设备，以便我们可以平移容器。

但是，所有媒体查询都依赖于设备宽度，而不是 type ，所以我坚持做类似的事情：

@media only screen and (max-device-width: 768px) {
    .dragscroll-container {
        overflow: auto;
    }
}

但是如果设备的屏幕宽度高于768px怎么办？当然，这很奇怪，但如果发生这种情况，我们将无法平移容器，因为overflow: auto规则将不会应用。

是否存在包含便携式设备的媒体查询，无论设备宽度如何？

Answer 1

听起来我最好的办法是明确指定每个移动设备的CSS。 Chris Coyier非常友好地发布了您在此处需要执行的所有媒体查询：https://css-tricks.com/snippets/css/media-queries-for-standard-devices/