迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 >

移动端网页制作bug总结(一)

作者:嫣然 最近更新:2022/11/13 浏览次数:

1.安卓里有一像素白边问题

像这个结构可以用dl dd dt 结构写,dl的width可以有两种设置的方法:

(1)width:100%;(2)width:94%;pading:3%;

以上两种设置宽度的方式都可以,但是第二种会出现1像素白边的问题,所以建议用第一种,边距在dd,dt里设置这个问题只有在安卓里才出现的,用谷歌里的模拟器测不出来,只有用手机才能看出来,我用三星,小米的手机都测出有这个问题

2.手机端去掉点击时默认的边框

*:focus {outline: none;}
* { -webkit-tap-highlight-color: transparent; -webkit-appearance: none;  border:0}

3.textarea对定位的影响

像这个页面的底部,我们一般用定位固定到最底部:position:fixed;但是当有输入框textarea时,但是点击textarea的文本框,下面的键盘会把底部顶上去,这就是一个小小的bug,我刚遇到这个问题时,从网上找了好多方法,试了好多方法,终于找到了一个解决方法,在代码中引入

<script>
    if (/ipad|iphone|mac/i.test(navigator.userAgent)){}
</script>

4.安卓手机a标签访问后变色的问题

a标签是做超链接的,我们假设给a设计a{color:red;}我们希望当访问a后再返回到这个页面时,a中的字的颜色还是红色;但是安卓机出现了一个问题:返回后a中的字变色了,我们只需加上a:visited{color:red}这个问题就可以解决了。

从事移动开发也有小半年了,上面的bug都是我在平时工作时遇到的,现在分享给大家,以免大家走弯路,当然还有好多移动端的bug没有整理出来,望大家继续关注,我会陆续把我在工作中的总结分享给大家的,有那里说的不对的,还望大家指正,在此不胜感激了。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便