[这里,我录制了有关问题的视频。https://www.youtube.com/watch?v=WZbKix3XGTE
问题是键盘在屏幕上时。键盘后面的内容无法访问。如果有输入页面的末尾,用户将看不到正在输入的内容。
我仅在chrome上有此问题,其他浏览器正常工作。
我在此心中的所有解决方案均包含javascript。但是我不确定javascript能否完美地处理这个问题。我想在开始之前询问您的知识。仅使用CSS或其他方法,还有其他选择吗?
示例代码
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=1" />
<title></title>
<style type="text/css">
#top {
background-color: lightgreen;
width: 100%;
height: 600px;
}
#bottom {
background-color: green;
height: auto;
padding: 20px;
margin-top: 10px;
}
#bottom > input {
display: block;
padding: 5px;
width: 100%;
}
</style>
</head>
<body>
<div id="top">Top</div>
<div id="bottom">
<input type="text" />
</div>
</body>
</html>
您得到这个答案了吗?之前还可以,但是现在android-chrome位于页面顶部,不再将其推上去。我正在使用webview,也许他们有一些选择吗?
快速解决方法是在屏幕底部添加填充,可能是200-300px