Question

我已阅读相关帖子; '移动CSS页面宽度 - 等'但尚未找到解决方案。

我开发了一个网站的移动版本，宽度在Android和Blackberry中都很好 - 但是，由于某种原因在iPhone中，内容的两侧还有额外的空间，使得网站的渲染量略小于内容区域和更多背景。当用户双击时 - 然后，像Android和Android中一样拍摄全屏。黑莓。

有什么建议吗？

我已尝试声明doc mobile，并使用'<meta name="viewport" content="width=device-width, initial-scale=1.0">'但它会过多地缩放网站（我应该尝试切换'initial-scale'）吗？

我已经尝试了基础知识以及设置为液体等。

我不能使用类似的脚本，因为我使用移动重定向来定义每个设备的宽度呈现方式？

<!--Script for Mobile Redirect -->  

<script type="text/javascript">

var redirectagent = navigator.userAgent.toLowerCase();
var redirect_devices = ['vnd.wap.xhtml+xml', 'sony', 'symbian', 'nokia', 'samsung', 'mobile', 'windows ce', 'epoc', 'opera mini', 'nitro', 'j2me', 'midp-', 'cldc-', 'netfront', 'mot', 'up.browser', 'up.link', 'audiovox', 'blackberry', 'ericsson', 'panasonic', 'philips', 'sanyo', 'sharp', 'sie-', 'portalmmm', 'blazer', 'avantgo', 'danger', 'palm', 'series60', 'palmsource', 'pocketpc', 'smartphone', 'rover', 'ipaq', 'au-mic', 'alcatel', 'ericy', 'vodafone', 'wap1', 'wap2', 'teleca', 'playstation', 'lge', 'lg-', 'iphone', 'android', 'htc', 'dream', 'webos', 'bolt', 'nintendo'];
for (var i in redirect_devices) {
if (redirectagent.indexOf(redirect_devices[i]) != -1) {
location.replace("http://www.osmproduction.com/crown/maxbrooks/Test/MobileZombie/index.html");
}
}
</script>

<!--End Script for mobile Redirect -->

子问题：任何人都可以向我提供有关优化黑莓手机的最佳做法的建议 - 页面现在在某个黑莓模型中呈现超级缩放（不要回忆模型，但2007年） - 我假设这个讨论采取每个设备的宽度也应该解决这个问题，对吗？或者正在为黑莓开发一些单独的问题？还有什么我必须单独看，因为它们有点难以浏览？

Answer 1

使用<meta name="viewport" content="width=800">，其中800是适合您布局的像素数量。默认情况下，iPhone使用980，因此如果您的页面具有800px的固定宽度，您将获得180px的空白空间。

Answer 2

我使用以下META标签。它似乎与我的测试一起工作正常：

<META name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />

无论尺寸大小，这都将扩展到设备的宽度。

Mobile / iOs中的页面宽度

2 个答案: