1、在设置移动端页面的宽高为100%的时候,里面的元素设置flex:1的时候,因为浏览器的地址栏以及下面的工具栏的问题会导致在有的手机上面的页面显示不全的问题。因为我们不好计算每一个浏览器的地址栏以及工具栏的高度,所以我们直接把它隐藏起来即可,下面的隐藏的代码。
参考:https://juejin.cn/post/6844903983811674126
备注:自测只有iso会生效,其他无效
demo:
if(isAndroid()){
if(isInWeixin() || isWeibo() || isDingTalk() || isBaidu()){
this.bottom = 0;
}else if(isUCBrowser()){
this.bottom = 20 * window.devicePixelRatio + 10;
}
}else{
this.bottom = 12 * window.devicePixelRatio + 10;
}
//判断是否是Android,然后再判断是哪个APP或浏览器,再添加底部安全距离,避免遮挡网页内容,
//如果是iOS就直接使用 就可以了。
2、移动端 a 标签点击会有蓝色的背景色
解决方案:
a { -webkit-tap-highlight-color:transparent; }