1.開發行動端，頭部必要的配置
viewport" content="width=device-width,initial-scale= 1,user-scalable=no">（各屬性值不在介紹，在開發中小米（2016年小米4）測試user-scalable=no是不起作用的）
2.rem的使用設定根節點的font-size,開發過程中是用Js計算的。
公式320/100=螢幕尺寸/fontSize值
3.需要點擊跳轉，語意標籤是a（dispaly:block;）
在語意化考慮的情況下a標籤中新增一個span(disply:block)，span在新增容器
4.為了使用者友善體驗，在開發行動裝置頁面時候設定最大寬度和最小寬度。如
{
max-width:640px;
min-width:320px;
}
5.行動端開發頁面一些默認樣式
禁止a標籤背景
a,button,input,optgroup,select,textare{
// 去掉a,input,button點擊時藍色外邊框和灰色半透明
-webkit- tap-highlight-color:rgba(0,0,0,0);
}
禁止長按a,img標籤出現選單列
a,img{
// 禁止長按顯示選單列
-webkit-touch-callout:none;
}
流暢捲動
body{
-webkit-# overflow-scrolling:touch;
}
6.單行截取參考http://www.cnblogs.com/victory820/p/6728904.html
#7.calc的使用，不考慮低版本（ie11以下安卓56以下，opera所有）相容性，建議使用，方便。
8.box-sizing的使用，解決不同瀏覽器盒模型的展現不一致。 （行動端常用）
content-box;預設值標準模型，width和height不包含邊框內邊距外邊邊距
#padding-box;width和height包含內邊距不包括邊框和外邊距
border-box;怪異模型width和height包括內邊距和邊框，不包括外邊距。
9.水平垂直居中（行動端常用）
缺點：需要知道小容器的寬度和高度
格式
< ;p class="child">
11.vertical-align調整圖示垂直居中（行動端常用）
baseline:內容與父元素基線對齊
sub:元素基線與父元素下標基線對齊
super:元素基線與父元素上標基線對齊
top:元素及其後代頂端與整行頂端對齊
text-top:元素頂端與父元素字體的頂端對齊
middel:元素中線與父元素的基線對齊
bottom:元素及其後代底部與整行的底部對齊
text-bottom:元素底部與父元素字體的底部對齊
percentage:百分比指定偏移量。基線是0%
length:數值方式，基線是0（常用）
12.flex的使用
使用flex時候，如果兩列不是平均分配，試試給width設定為0
https://csstriggers.com/檢查css屬性觸發的哪些流程
以上是行動端h5開發相關內容總結css篇的詳細內容。更多資訊請關注PHP中文網其他相關文章！
