1. 字型
font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif;
font-family: 'Helvetica Neue',Helvetica,Arial,'Microsoft Yahei',sans-serif
font-family:'Helvetica Neue',Helvetica, Arial,'Lantinghei SC','Hiragino Sans GB',STHeiti,'Noto Sans S Chinese','Microsoft Yahei','Microsoft Sans Serif','WenQuanYi Micro Hei',sans-serif;
2. 完美視口(viewport)
<meta name="viewport" content="initial-scale=1.0,width=device-width,user-scalable=0,maximum-scale=1.0"/>
3. 移動端居中
translate版
.center {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
}
flexbox版
.center {
justify-content: center;//子元素水平居中
align-items: center;//子元素垂直居中
display: -webkit-flex;
}
4. 頂層容器
設定最小最大寬度，寬度自適應，字型預設大小，背景色為灰色
.container {min-width: 320px; max-width: 640px; width: 100%; margin: 0 auto;; background: #ccc; font-family: 'Helvetica Neue',Helvetica,Arial,'Microsoft Yahei',sans-serif;font-size: 12px;}