移动网页,input呼出软键盘,布局受影响

移动web页面,采用vh布局,默认撑满全屏,但是当input输入框,获取焦点时,软键盘呼出,可视区域高度减小,页面布局高度受影响,导致字体很小
图片描述
图片描述

阅读 7.8k
6 个回答

布局上可以使用rem,但是字号大小不建议使用。另外vh布局兼容性差,也不建议使用。当键盘调起时,应该是将页面顶上去或者盖在页面上。楼下说不定有大神能解决你的问题...

media 根据高度适配一下

@media screen and (max-height: 300px) {
    
}

很显然设置自动调整字体大小,可以按照下面的来做

html,body{
    -webkit-text-size-adjust: none;
}

定位,距离bottom为0,试一下

已经解决了,将单位改成px就可以了,蟹蟹各位

新手上路,请多包涵

这个主要问题是vh吧,vh是屏幕可视区域高度

推荐问题