移動端開發的那點事兒

移動端開發

• Emulation: 谷歌瀏覽器開發者工具中的插件
• Device： 設備信息
• 像素比（device  pixel ratio）:
  • iPhone5:1136*640 獨立像素
  • iPhone5： 568 * 320 物理像素
  • 像素比：2
• 不少專家說onclick這樣的事件在移動端有半秒延遲
• viewport
  •  <meta name="viewport" content="width=device-width,height=device-height,user-scalable=no,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,target-densitydpi=device-dpi" /> 
• 媒體查詢
  • @media all and (max-width: 400px)
  • all 全部媒體
  • 關鍵字：and，not（排除掉某種設備類型），only（特定的媒體設備）
• 橫豎屏
  • @media all and (orientation: landscape)
  • @media all and (orientation: portrait)
• 主流移動設備分辨率: 240*320（通常不考慮）、320*480、480 * 800（多）、640*960（多）、480*85四、1280*720、800*1280、 1080*1920
• em相對於字體大小  font-size: 24px;  1em = 24px;
• rem相對於根節點字體大小的計量單位