我正在做一个响应式网站，但我遇到了这个问题。一切正常，直到我选择[input type =“ text”]并弹出键盘，整个站点的大小都被调整了，就像屏幕大小只是键盘上方的一部分一样。我只想保留正常大小。我也尝试了在另一个论坛上在stackoverflow上提出的所有解决方案，而发bun似乎没有任何作用。
有人对如何解决这个问题有任何想法吗？
<head>
<title>SchoolIn</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
//other code
UPDATE：我将尝试更好地解释。
我有一个头部
//other code
<div class="head">
//Here is some text
</div>
//other code
然后是内容部分
//other code
<div class="container">
<div class="content">
//other code
<input type="text" ...... />
<input type="password" ..... />
<input type="submit" ..... />
</div>
</div>
//other code
所有元素都以百分比表示，没有像素。
当键盘弹出标题时，将重新定义容器和内容div，而不是输入字段和按钮。无论如何，它们都是从容器中出来的，因为容器变小了，并且保持了原始尺寸。我不知道自己是否清楚。
问题是相同的，当键盘出来时如何使它保持原始大小？
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
尝试这段HTML。我在我的每个页面上都使用它，并且它总是按其应有的方式工作。也许是由于缺少最小比例尺属性而无法使用。
在我的情况下（Android 2.3浏览器）没有可用的<meta name='viewport'/>或百分比修复程序，所以最终得到了以下CSS：
body {
min-height: 350px;
}
您还需要对height:auto执行任何操作。
这是一个骇客，但至少可以使网站在这种情况下可用。一旦用户尝试缩放，它就会从中弹出。
好吧，我至少要使它工作。对我来说，问题是我使HTML和BODY的高度为100％，所以当键盘出来时，高度就变成了其上方的部分。如果我不声明任何高度，则可以正常工作。
html, body{
height: 100%;
}
我之所以这样说，部分原因是我需要设备的高度，以便可以与页面内的元素进行比例分配。如果我不声明高度，则页面内容将在某些智能手机中半屏显示，而在其他方面则将显示。我已经在媒体查询方面取得了突破，但是我无法针对每种分辨率都做到这一点。我已经创建了一些范围（例如：最大宽度：320 ----最小宽度：321，最大宽度：480 ....等等）。
关于解决身高问题的任何想法？
这对我有用：
在调用虚拟键盘（Android）时，任何基于视口/百分比的元素的大小都会改变。一种解决方法是获取当前内部窗口高度的大小（以像素为单位）然后将其用作要在键盘弹出窗口上保持不变的元素的高度。
使用jQuery：
$(document).ready(function() {
/* ... */
var windowHeight = $(window).innerHeight();
$('body').css({'height':windowHeight});
/* ... */
});