有没有办法检测手持式浏览器是否被使用(iOS / Android手机/平板电脑)?
我尝试这样做的目的是使一个元素在手持设备上的浏览器的一半宽,但没有什么不同。
width: 600px; @media handheld { width: 300px; }
可以做到吗?
编辑:从jmaes的回答中引用的页面我用过
@media only屏幕和(max-device-width:480px)。
解决方法
更新(2016年6月):我现在尝试在每个分辨率上支持触摸和鼠标输入,因为设备横向缓慢地模糊了什么是不是触摸设备之间的界限。 iPad专业版是触摸式的,具有13“笔记本电脑的分辨率,Windows笔记本电脑现在经常搭配触摸屏。
其他类似的SO答案(请参阅此问题的其他答案)可能会有不同的方法来尝试确定用户使用的是什么类型的设备,但是它们都不是傻瓜的。如果您绝对需要尝试确定设备,我建议您检查这些答案。
iPhone手机忽略手持式查询(Source)。如果其他智能手机也出现类似的原因,我也不会感到惊讶。
目前我用来检测移动设备的最佳方式是知道其宽度,并使用corresponding media query来捕捉移动设备。那个链接列出了一些流行的。我可以肯定,快速的谷歌搜索会让你任何其他你可能需要的。