响应式设计

1.1px问题

在retina显示屏中，1px像素实际对应2px像素，为了实现真正的1px粗细，我们需要使用0.5px来模拟，ios8+可以直接使用0.5px单位，其他版本需要通过scale：0.5来进行模拟

2.浏览器渲染

渲染过程：

• 处理HTML标记并构建DOM树（文档对象模型）
• 处理CSS标记并构建CSSOM树（CSS对象模型）
• 将DOM和CSSOM合并成一个渲染树
• 根据渲染树来布局，以计算每个节点的几何信息，再将各个节点绘制到屏幕上
  其中构建DOM树的过程为：
  1.转化：浏览器从磁盘或网络读取HTML原是字节，并根据文件的指定编码（UTF-8）将它们转化成各个字节
  2.令牌化：浏览器将字符串转化为W3C HTML5规定的各种令牌，每个令牌都具有特殊含义和一组规则
  3.词法分析：发出的令牌转化成定义其属性和规则的对象
  4.DOM构建：最后，由于HTML标记定义不同标记之间的关系，创建的对象链接在一个树数据结构内，此结构也会捕获原始标记中定义的父子关系，最终就会输出文档对象模型（DOM）
  构建CSS对象模型与构建DOM相同，都构建完毕后，就会将DOM树与CSSOM树合并成渲染树
  注意：渲染树只包含渲染网页所需的节点，display：none；的元素不会出现在渲染树中