我正在开发一个应该调整到设备可能具有的任何屏幕尺寸的webApp.在iOS和较旧的Android版本上,视口标记工作正常.屏幕上的图片始终调整大小以适合屏幕.
(如下所述:https://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html#//apple_ref/doc/uid/TP40006509-SW19)
在Galaxy Nexus上(Android 4.0)它无法正常工作.在左侧和右侧约20px空间,我不知道他为什么这样做.我的viewport标记如下所示:
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
Run Code Online (Sandbox Code Playgroud)
无论我对标签做了什么改变,空间总是存在,内容不适合屏幕.我已经制作了一个示例页面来向您展示效果:http://easyeve.w3y.de/link/index.html
如果您在iPhone上打开此链接,内容完全适合(您将看不到任何黄色=正文)文档宽度为320px.在Galaxy Nexus上,您将看到黄色空间,文档宽度为360px(正好是显示分辨率的一半).这也应该是320px!你有这个问题,还有办法解决吗?
更新:我在Galaxy Note/Android 2.3.6上发现了同样的问题因此它不是Android 4的问题.它与我猜的大屏幕尺寸有关..