移动端的各种小技巧（1）

• 防止safari和WP浏览器下文字在横竖屏切换时尺寸发生变化

body { -webkit-text-size-adjust : none; -ms-text-size-adjust : none; }

• 去除在IE9以上浏览器中a标签点击时的灰色背景

a { background-color : transparent; }

• 去除手机超链接点击背景色

WP手机：<meta name="msapplication-tap-highlight" content=“no”/>
Webkit：a { -webkit-tap-highlight-color : transparent; }

• 长按时不触发系统菜单

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

• 去除IOS下input元素的内阴影

input { -webkit-appearance : none; }

• 内容垂直居中

内容垂直居中一般用于弹出层，如果尺寸固定的话，用CSS绝对定位就可以搞定，但是如果尺寸是不固定的，就需要使用js动态定位。
其实在移动端还可以使用display:box;就可以轻松的让内容垂直居中，如下：

<div class="box">
    <div class="content">
        <p>我是内容-1</p>
        <p>我是内容-2</p>
    </div>
</body>
<style>
.box {
    width:800px;height:600px;background:red;
    display : -webkit-box;
    -webkit-box-orient : horizontal;
    -webkit-box-pack : center;
    -webkit-box-align : center;
    display : -moz-box;
    -moz-box-orient : horizontal;
    -moz-box-pack : center;
    -moz-box-align : center;
}
</style>