移动端常见的问题

1.border-radius百分比失效   解决办法：设置一个较大值如border-radius:9999px

2.placeholder属性设置的文字向上偏移的厉害   解决办法：line-height:normal

3.webkit上的input,button,及select的默认样式可以通过以下代码禁用，然后自定义。 解决办法：-webkit-appearance:none;

4.body设置100%高度后，在移动浏览器里面可能会被底部的导航栏挡住:  解决办法：document.documentElement.style.height = window.innerHeight + "px"

5.字体设置建议   建议：

body {
        font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif;
}

6.安卓浏览器看背景图片，有些设备会模糊

想让图片在手机里显示更为清晰，必须使用2x的背景图来代替img标签（一般情况都是用2倍）。例如一个div的宽高是100100，背景图必须得200200，然后background-size:contain;，这样显示出来的图片就比较清晰了。
代码可以如下：
123
background:url(../images/icon/all.png)
 no-repeat center center;-webkit-background-size:50px
 50px;background-size:
 50px 50px;display:inline-block; width:100%; height:50px;  
或者指定 background-size:contain;都可以，大家试试！
7.apple-mobile-web-app-capable是设置Web应用是否以全屏模式运行。

<meta name="apple-mobile-web-app-capable" content="yes">

8.format-detection 启动或禁用自动识别页面中的电话号码。

<meta name="format-detection" content="telephone=no">
说明：
默认情况下，设备会自动识别任何可能是电话号码的字符串。设置telephone=no可以禁用这项功能。

9.html5调用安卓或者ios的拨号功能

<a href="tel:4008106999,1034">400-810-6999 转 1034</a>

10.上下拉动滚动条时卡顿、慢

body {  -webkit-overflow-scrolling: touch;  overflow-scrolling: touch;}
11.长时间按住页面出现闪退

element {
  -webkit-touch-callout: none;
}

12.iphone及ipad下输入框默认内阴影

Element{  -webkit-appearance: none; }
13.ios和android下触摸元素时出现半透明灰色遮罩

Element
 {  -webkit-tap-highlight-color:rgba(255,255,255,0)}
设置alpha值为0就可以去除半透明灰色遮罩，备注：transparent的属性值在android下无效。
14.旋转屏幕时，字体大小调整的问题

html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {  -webkit-text-size-adjust:100%;}
15.transition闪屏

/设置内嵌的元素在 3D 空间如何呈现：保留3D / -webkit-transform-style: preserve-3d;/ 设置进行转换的元素的背面在面对用户时是否可见：隐藏 / -webkit