对第一次专门做前端的我，给我一张psd图让我切图，还真有点茫然，不知道从何做起，拿到这张psd图，然后一个流程是怎样的。 叫兽，只告诉我就是切成html，我知道要切成html，因为我理解的html比较肤浅就是所谓的html代码.听到这，我就纳闷了，资源已经有了， 切好的又都是table标签的布局的html代码，根本没用。因为我们通常是用div+css布局。那我就觉得这样为什么还要切呢。但是，叫兽也是很无语， 给我一张图，就是让我切成html，他理解的比较深入，他的意思应该是包括html的各种元素。我实在没办法，就照着自己想的， 自己用webstorm2+zencoding纯手写div+css的布局。后面有遇到问题，就请教典哥，典哥很认真的跟我讲了一下整个流程。灰常感谢。 叫兽也安排了另外一个同事具体的讲了一下切图的整个流程，很感谢这个课，讲的很好，让我对切图有了进一步的了解。 下面就总结下我自己对切图这部分的理解和心得
切图的流程：
-
弄清需求one
1.首先要弄清，这个是手机端还是PC端的，PC端一般最小宽度是960px
2.看下有几张设计图：认真观察设计图，要分析几个问题（1）设计图是否合理
（2）是否有通用模块可以拿出来共用
（3）是否要支持ie6
（4）整体的字体大小，背景，链接；一般手机上默认字体是16px，PC默认字体是12px，微软雅黑的 - 写html
看整体架构可以分几块，分清哪些是可以用css渲染的，那些是要分块出来的。整体架构要写出来。尽量 整洁让人易懂。标签使用语义化标签 - css
盒子模型
（1）标准的盒子模型
（2）IE6下的盒子模型
对这块还需要再进一步学习 - 优化图片image
对psd图，我们存储的时候，一般要存储成web html的，图片存为png格式的。对比较大的图片可以存成jpg格式。还有，因为每一张图片都是一个http请求， 所以尽量把图片都放在同一张上面，然后使用position定位。这个典哥传授的。
后期学习:
expression:
需要继续积累经验