设置浏览器默认样式

选中文本时的字体颜色
::selection { color: white; background: #0aa284;}

去掉chrome记住密码后自动填充表单的黄色背景
input:-webkit-autofill {-webkit-box-shadow:0 0 0px 1000px white inset; border : 1px solid #CCC !important ;}

chrome字体缩小
.chrome_adjust { font-size: 9px; -webkit-transform: scale(0.75); }

手机上取消高亮边框
{ -webkit-appearance: none; -webkit-tap-highlight-color: rgba(0,0,0,0);}

一行省略号
.ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

去掉默认表单元素样式

-webkit-appearance: none;

加上这个让浏览器支持touch和自动滚动这样界面就可以滚动了
overflow-y: auto; -webkit-overflow-scrolling:touch;

使用 viewport meta 标签在手机浏览器上控制布局
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1" />

通过快捷方式打开时全屏显示
<meta name="apple-mobile-web-app-capable" content="yes" />

隐藏状态栏
<meta name="apple-mobile-web-app-status-bar-style" content="blank" />

iPhone会将看起来像电话号码的数字添加电话连接，应当关闭
<meta name="format-detection" content="telephone=no" />

 

抗锯齿

-webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0,0,0,0.004);