移动/iOs 中的页面宽度

Question

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

我已经开发了一个网站的移动版本，在 Android 和 Blackberry 中宽度可以很好地填充 - 但是，由于某种原因，在 iPhone 中，内容的两侧仍有额外的空间，使得网站在内容区域和更多背景。当用户双击时，它会像在 Android 和 Blackberry 中一样全屏显示。

有什么建议吗？

我尝试过声明 doc mobile，并使用“<meta name="viewport" content="width=device-width, initial-scale=1.0">”，但它会过度放大网站（我是否应该尝试切换“初始比例”）？

我也尝试过设置为液体等的基础知识。

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

<!--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，因此如果您的页面具有 800 像素的固定宽度，您将在其周围获得 180 像素的空白空间。

Answer 2

我使用以下 META 标记。它似乎适用于我的测试：

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

这将缩放到设备的宽度，无论它是什么尺寸。