1.-webkit-tap-highlight-color:rgba(255,255,255,0) 可以同时屏蔽ios和android下点击元素时出现的阴影。 2.-webkit-backface-visibility:hidden; 3.-webkit-transform-style:preserve-3d 解决闪屏 4.-webkit-user-select: none; 禁止页面文字选择 ,此属性不继承,一般加在body上规定整个body的文字都不会自动调整 5.-webkit-appearance: none; 消除输入框和按钮的原生外观,在iOS上加上这个属性才能给按钮和输入框自定义样式 不同type的input使用这个属性之后表现不一。text、button无样式,radio、checkbox直接消失 6.-webkit-text-size-adjust: none; 禁止文字自动调整大小(默认情况下旋转设备的时候文字大小会发生变化),此属性也不继承,一般加在body上规定整个body的文字都不会自动调整 7.-webkit-touch-callout:none; 禁用长按页面时的弹出菜单(iOS下有效) ,img和a标签都要加 8.-webkit-overflow-scrolling:touch; 局部滚动(仅iOS 5以上支持) 9、在手机端如果1px线条仍然显示过粗,可以使用css新属性border-image边框图像来解决 例:border-image: url(../img/line-img1.png) 2 0 round; 关于border-image熟悉的介绍:http://www.w3cplus.com/content/css3-border-image 10、在部分安卓机上使用border-image后,发现内容区域设置 :active 后不起作用。 原因:border-image 后面默认加了fill关键字 解决办法:使用的边框图片,图片中间区域背景一定要是透明的。 部分安卓机对键盘事件不兼容,如果是对输入框内容监听变化可用input事件 11、部分iphone上,页面内如果有position:fixed固定内容,第一次滑动页面时,固定内容会随页面滑动,松开手后,内容回到原位。bug原因和覆盖范围未知。 解决办法:用js控制固定内容第一次滑动时的的top值 12、防止按钮点击时 背景闪烁 html{ -webkit-tap-highlight-color: transparent; } 13、设置input的placeholder内容样式的方法 input::-webkit-input-placeholder{ color:#999; font-size: 14px; } 14、兼容iOS伪类 :active 需要给 document 绑定 touchstart 或 touchend 事件 document.addEventListener('touchstart',function(){},false); 15、消除 IE10 里 input输入框右侧的叉号 input:-ms-clear{ display:none; } 16、 禁止用户选中文字 -webkit-user-select:none