解决移动端两端布局的input+fixed的bug

在移动端布局中，会经常出现固定在手机上下两端的页面。

但是fixed定位和软键盘碰上之后，会碰到各种的坑，ios和android上都会遇到。

下面就分享一下如何解决此问题，代码实例如下:

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

< html lang = "en" > < head > < meta charset = "UTF-8" > < meta name = "viewport" content = "width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" > < title >蚂蚁部落 title > head > < body > < div class = "main" > < p >可以用手机看看 p > < p >test p > < p >软键盘出来后 p > < p >test p > < p >foot是否会错位~ p > < p >test p > < p >test p > < input type = "text" placeholder = "我是一个输入框" > < input type = "text" placeholder = "用手机点我啊" > div > < div class = "foot" > copyright by linyang div > body > html >

原文发布时间为：2017-2-23

本文作者：admin

本文来自云栖社区合作伙伴“蚂蚁部落”，了解相关信息可以关注蚂蚁部落

原文链接：解决移动端两端布局的input+fixed的bug