所以，我一直在使用：如何设置iPhone的视口元，以正确处理旋转？
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;"/>
让我的HTML内容在iPhone上完美呈现。它很好用，直到用户 将设备旋转到横向模式，其中显示仍然限制为320px。
是否有一种简单的方法来指定一个视口，该视口响应用户更改设备方向而发生变化？或者我必须诉诸Javascript来处理？
只是努力工作，这一点我自己，我想出了解决办法是：
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
这似乎装置锁定到1.0的规模，无论它的方向。作为一种副作用，它确实会禁止用户缩放（缩放缩放等）。
它还可以防止内容在初始显示时正确调整大小。如果您完全从视口标记中省略`initial-scale`元素，则HTML内容最初会缩放，以使其完全适合查看器; `initial-scale = 1.0`，内容通常比网页浏览框更宽或更窄。 – MusiGenesis 2012-08-22 20:30:45
我有一个应该处理它的略微不同的方法，只要你理解它的想法，稍微调整一下，http://www.jqui.net/tips-tricks/fixing-the-auto-scale-手机上的设备/ – Val 2012-11-06 09:55:16
您将其设置为无法缩放（最大缩放比例=初始缩放比例），因此在旋转到横向模式时无法缩放。设置最大比例= 1.6，它会正确缩放以适应风景模式。
嗯，只是试过了，它似乎没有任何效果。就好像UIWebView的尺寸以某种方式固定在纵向方向尺寸上。 – 2009-08-07 01:41:23
对于任何人仍然有兴趣：
http://wiki.phonegap.com/w/page/16494815/Preventing-Scrolling-on-iPhone-Phonegap-Applications
从页面：
<meta name="viewport" content="user-scalable=no,width=device-width" />
这指示Safari浏览器，以防止 用户从放大到 页的 “捏”手势并修复了视图宽度为 的宽度为 的屏幕，它曾经定向 iPhone是英寸
我有这个问题我自己，我希望双方能够设置宽度，有它在旋转更新，并允许用户扩展和缩放页面（当前答案提供了第一个，但防止后者作为副作用）..所以我想出了一个修复，保持视图宽度正确的方向，但仍允许缩放，但它不是非常直截了当。
首先，添加以下JavaScript到正在显示页面：
<script type='text/javascript'>
function setViewPortWidth(width) {
var metatags = document.getElementsByTagName('meta');
for(cnt = 0; cnt < metatags.length; cnt++) {
var element = metatags[cnt];
if(element.getAttribute('name') == 'viewport') {
element.setAttribute('content','width = '+width+'; maximum-scale = 5; user-scalable = yes');
document.body.style['max-width'] = width+'px';
}
}
}
</script>
然后在你的 - （空）didRotateFromInterfaceOrientation：（UIInterfaceOrientation）fromInterfaceOrientation方法，添加：
float availableWidth = [EmailVC webViewWidth];
NSString *stringJS;
stringJS = [NSString stringWithFormat:@"document.body.offsetWidth"];
float documentWidth = [[_webView stringByEvaluatingJavaScriptFromString:stringJS] floatValue];
if(documentWidth > availableWidth) return; // Don't perform if the document width is larger then available (allow auto-scale)
// Function setViewPortWidth defined in EmailBodyProtocolHandler prepend
stringJS = [NSString stringWithFormat:@"setViewPortWidth(%f);",availableWidth];
[_webView stringByEvaluatingJavaScriptFromString:stringJS];
额外的调整可以通过修改更多视窗内容设置来完成：
另外，我知道你可以放置一个JS onresize或类似的东西来触发重定标，但是这对我来说是可行的，因为我是从Cocoa Touch UI框架来做的。
希望这可以帮助别人:)
你不想失去用户缩放选项，如果你能帮助它。我喜欢这个来自here的JS解决方案。
<script type="text/javascript">
(function(doc) {
var addEvent = 'addEventListener',
type = 'gesturestart',
qsa = 'querySelectorAll',
scales = [1, 1],
meta = qsa in doc ? doc[qsa]('meta[name=viewport]') : [];
function fix() {
meta.content = 'width=device-width,minimum-scale=' + scales[0] + ',maximum-scale=' + scales[1];
doc.removeEventListener(type, fix, true);
}
if ((meta = meta[meta.length - 1]) && addEvent in doc) {
fix();
scales = [.25, 1.6];
doc[addEvent](type, fix, true);
}
}(document));
</script>
我想出了一个性能稍微不同的方法，应在跨平台的
http://www.jqui.net/tips-tricks/fixing-the-auto-scale-on-mobile-devices/
到目前为止，我对
萨姆松星系测试工作2
iPhone 4
@media screen and (max-width:800px) {这是一个巨大的嘴唇与移动发展...
只是想分享，我已经玩过我的响应式设计的视口设置，如果我将最大比例设置为0.8，初始比例设置为1并且可以缩放为无，然后我在纵向模式下获得最小视图， iPad上查看景观：d ...这是正确的丑陋的黑客攻击，但它似乎工作，我不知道为什么，所以我不会使用它，但有趣的结果
<meta name="viewport" content="user-scalable=no, initial-scale = 1.0,maximum-scale = 0.8,width=device-width" />
享受:)
<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
suport all iphones，all ipads，all androids。
为什么不重新加载页面，当用户在这里旋转屏幕使用JavaScript
function doOnOrientationChange()
{
location.reload();
}
window.addEventListener('orientationchange', doOnOrientationChange);
好读它 - https://developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag# Viewport_width_and_screen_width – vsync 2013-04-19 13:47:42
只是一个注释 - ---键对分隔符应该是```不是`;`---在Google Chrome中给出解析错误（`解析meta元素的内容时出错：';'不是有效的键值请使用'，'来代替。） – Bill 2014-03-06 00:44:18