移动端web开发坑

1. p，div高度问题。在移动端开发的时候一般会重设font-size, 类似于html{font-size:100px}，使用p,div, li之类的标签之后，发现占用了一大块位置。查看margin,padding发现设置成0了。最后追查原因，原来是这些标签的高度会默认设置成1rem，也就是100px。解决办法，重设font-size, 如p,div,li{font-size:0.14rem;}

2. 点击a标签时有边框，一般绑定了click事件的元素需要

   a,button,input{-webkit-tap-highlight-color:rgba(255,0,0,0);}

   
   

3. 取消移动端input的内阴影

   -webkit-appearance: none;

   
   

4. 取消iphone识别数字为电话号码，从而加上特殊样式

   <meta content=“telehpone=no” name=“format-detection”>

   
   

5. iphone4s， iphone4表格的border显示用px单位，不要用rem

6. ipad, iphone的safari浏览器点击返回按钮不会执行js，js需要放在window.οnpageshοw=function(){}中