我正在寻找检测平板电脑的完美方法.使用媒体查询,您可以为特定CSS设置最小和最大宽度.但有些平板电脑的分辨率高于soms桌面显示器.这样会产生冲突.
使用Javascript(Modernizr,Detectivizr)可识别平板电脑,并在HTML标签上使用“平板电脑”类设置此平板电脑.但是……并非所有用户都启用了Javascript.
所以你想要的是(在我看来)使用CSS来检测平板电脑.有谁知道这个的完美解决方案?
Thanx提前!
解决方法
您可以使用CSS媒体查询获得合理的准确度:
@media only screen and (max-device-height : 768px) and (max-device-width : 1024px) { /* CSS Styles go here..... */ }
以上应检测设备屏幕大小何时小于1024×768(桌面的常见屏幕大小).
如上所述,如果您只是使用CSS,那么它并不完美,因为某些平板电脑的屏幕尺寸大于1024×768.
我知道提高准确性的唯一方法是使用javascript来嗅探userAgent字符串.请参阅GeenHenk链接到的问题(What is the best way to detect a mobile device in jQuery?).