前端精确还原设计稿，从psd到html

一、分析设计图

一般UI给的是iPhone6的视觉稿，会比实际的大2倍，比如宽度80需/2=40

1.大体结构，布局（如何排列、比如头、尾）

哪些可变，哪些不可变，

公共部分

列表等

复杂点的在哪，来估工作量

2.样式文件

一般样式分三种：

（1）重置样式reset.css

（2）公共样式，如头部、尾部 common.css

规范：比如calss="public-header"

（3）独立样式

3.html页面结构整理（先写整体布局）

      <div class="public-header">
        <div class="public-container"></div>
      </div>
      <div class="public-container index-banner"></div>
      <div class="public-container index-list"></div>
      <div class="public-container index-panel">
        <div class="index-panel-header"></div>
      </div>
      <div class="public-container index-panel"></div>
      <div class="public-footer">
        <div class="public-container"></div>
      </div>

4.公共头部和尾部

5.局部模块开发