移动端开发的那点事儿

移动端开发

• 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- 400px)
  • all 所有媒体
  • 关键字：and，not（排除掉某种设备类型），only（特定的媒体设备）
• 横竖屏
  • @media all and (orientation: landscape)
  • @media all and (orientation: portrait)
• 主流移动设备分辨率: 240*320（一般不考虑）、320*480、480 * 800（多）、640*960（多）、480*854、1280*720、800*1280、 1080*1920
• em相对于字体大小  font-size: 24px;  1em = 24px;
• rem相对于根节点字体大小的计量单位