我一直在研究媒体查询,但到目前为止,我在 google 和 Stack Overflow 上可以找到的所有示例都是使用特定大小(max-width
、max-device- width
等)问题在于它没有给我所需的灵 active 。我希望能够为台式机和平板电脑提供**专门定制的**体验。
我想这样做的原因是与平板电脑的交互不同于与小型计算机显示器的交互。横向的 iPad 是 1024x768,这也恰好是常见的计算机显示器尺寸。然而不同之处在于,在计算机上,用鼠标指向小控件很容易,但在 iPad 上点击相同大小的控件非常困难,尤其是对于手指粗大或笨拙的人。
与使用相同尺寸显示器的台式机用户相比,我如何才能为 iPad 用户提供量身定制的体验?我希望桌面体验不会被迫使用触摸体验所需的超大按钮。
这是否可以通过媒体查询或其他方式实现?我看到媒体查询有一个“手持式”选项,但我了解到大多数小型设备浏览器都忽略了这一点。
最佳答案
媒体查询是不可能的。有一种“手持式”媒体类型,但大多数(如果不是全部)现代手持设备都将自己标识为“屏幕”。
要用 javascript 做到这一点,请看这个问题: What's the best way to detect a 'touch screen' device using JavaScript?
关于CSS 媒体查询来检测设备类型而不考虑大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22085063/