ios下postion:fixed问题
问题描述：设计评论页面，使用position:fixed定位将输入框固定在页面底部,如图：
这种情况下，输入框在获取到焦点时，会随着输入法的弹出而上移。安卓的webview中是没有问题的。而ios中，输入法的弹出会导致整个页面向上滚动一定距离，问题如图：
原因：IOS浏览器对position:fixed的处理非常怪异，导致这个问题。
解决：网上大部分方法是根据浏览器动态更改fixed为static。但是我的想法是将评论区的高度固定，这样评论框下方没有因为评论内容过多而不显示的区域。当输入法弹出时评论框也就不会被这原本不显示的区域顶上去。同时还要设置评论内容区overflow-y:scroll，保证内容区的滚动。
总结：ios下position：fixed失效的问题可能不是我们前端h5能解决的，只能在布局上考虑到这个问题，然后想办法修改布局吧。
安卓与ios行高差异
问题描述：项目使用的icon-font.css来加载图标，但是在安卓和苹果上的布局效果是不一样的。安卓上图标是与文字水平对齐，但是ios页面中图标会向下偏移一段距离。
思考：这个图标本质好像并不是图片，是一种字体，可以通过font-size和color控制大小颜色。但是我在网上没有发现这类问题，我有点怀疑是不是测试机有问题。不过我之前在知乎有看到关于字体的问题字号与行高，然后我就想在ios和安卓的webview下，字体的行高line-height是不是有区别？试着把图标元素外div块的line-height设置为0，结果就解决了。（内心：嗯？一次性解决了？为什么啊？）我猜想，确实是ios对字体行高做了处理，导致上方高度多出一段，当设置行高为0后就不再多出一段？
总结：这个问题原理我目前不太清楚，但是能解决问题还是挺高兴的，说明平时看看一些知识还是有很大帮助。
生产环境下安卓机不加载外部图片
问题描述：前端页面从后台获取一个图片的链接，开发与测试环境下能够正常显示，但是到了生产环境下无法显示。而且只出现在安卓机中，IOS下不存在该问题。
原因：网上搜索了一下，发现WebView加载图片失败这篇文章讲的比较清楚。生产环境使用的是https，而测试和开发都是http。同时图片url也是http协议。可惜文章里讲的方法没用。
解决：重新上传图片，修改图片链接。
总结：这次问题出现很奇怪，但是比较几次后还是能定位问题到安卓开发者上的。因为IOS是没有问题的，所以并不是前端页面和后台数据的问题。那么安卓的问题可以精确定位到webview上。两个关键字webview和图片搜索即可找到答案。