由于自己大二自己玩过PS，所以，这节课就相对容易点。但是，PS不经常用的后果就是快捷键容易忘......
1、PS首选项的设置
编辑>首选项>单位与标尺，把标尺和文字单位改成像素
2、创建切图需要的工作区，关闭不需要的面板（窗口>工作区>新建工作区>保存工作区）,右上角选择工作区
a.信息面板（F8）
b.图层面板（F7）
c.历史记录面板
d.工具栏
e.选项栏
3、切图常用的工具
a.移动工具(选择图层、移动图层)
b.矩形选框工具（选择矩形框，查看信息面板，获取选中区域的宽高）
c.魔棒工具（容差越小，选择的颜色范围越小；消除锯齿，让边缘光滑）
d.裁剪和切片工具
e.取色器
f.缩放工具（放大画布：Ctrl+加号，缩小画布：Ctrl+减号，画布变成100%：Ctrl+1。可以设置滚轮缩放，更方便！）
4、组的概念
类似于文件夹
5、辅助视图
在视图菜单下开启：对齐（在移动图层时，当靠近参考线或者别的图层或者文件边缘会有吸附力）、标尺（Ctrl+r） 、显示>参考线（需勾选显示额外内容）
参考线的快捷键：Ctrl+;
6、CSS Sprite或者图片精灵
推荐文章：http://www.css88.com/archives/756
7、打开设计稿，获取信息
-尺寸信息（所有数字都要测量，矩形选框工具结合信息面板，测量时画布尽量放大！）
a.宽度、高度
巧用添加到选区功能测量较大的布局宽度： 在画布最左边作一个小的矩形选区，按住shift键，在画布最右侧作一个小的矩形选区，信息面板上的w即为布局宽度
b.内边距、外边距
c.边框
d.定位
e.文字大小
当文字是单独的图层，直接利用文字工具；
当文字图层被合并之后，就用矩形选框工具，获取的矩形高度信息就是文字大小。由于文字字体不同，字号会有差异，因此在测量文字大小时，选择较大的文字测量。
f.行高
当文字是单独的图层，直接利用文字工具；
当文字图层被合并之后，就用矩形选框工具，第一行文字的底部到第二行文字的底部的矩形高度就是行高
g.背景图位置
-颜色信息（所有颜色都要取色，取色时画布尽量放大，用拾色器和吸管工具）
a.边框色
b.背景色
利用取色器判断是否为纯色；
巧用魔棒工具确定是否为线性渐变；
c.文字颜色
当文字是单独的图层，直接利用文字工具；
当文字图层被合并之后，放大画布，用吸管工具取色；
如果文字图层被添加了叠加效果，就不用文字工具获取颜色，而是用拾色器。
8、切图之前先要明确哪些是需要切出来的
-修饰性的（一般用在background属性）：
a.图标、logo
b.有特殊效果的按钮、文字等
c.非纯色背景
-内容性的（一般用在img标签）
a.banner、广告图片
b.文章中的配图...
9、切出来的图片的保存类型
内容性的：颜色丰富的保存为JPG；
修饰性的：PNG8，PNG24（都支持全透明，但PNG24支持半透明，IE6不支持PNG24的半透明）
10、隐藏文字只留背景
-若文字为独立图层，隐藏文字图层即可
-若文字和背景合并，平铺背景覆盖文字即可
如果背景是纯色的，直接填充背景色，so easy，如果背景是渐变色，就用到矩形选框工具和自由变换（Ctrl+T）
较为麻烦的是背景色是纹理图，不能用自由变换的方法，只能用移动工具+Alt+Shift，水平方向移动矩形区域，注意纹理要对齐噢！
11、可平铺背景的切图
沿X轴平铺内容，充满文件的宽
12、保留一份PSD，在PSD上进行后期修改
沿Y轴平铺的内容，充满文件的高
12、切片工具（使用于可以一刀切的活动页）
·拉参考线
·选择切片工具
·点击"基于参考线的切片"按钮
·选择切片选择工具，在切片内容上右键>编辑切片选项>名称，修改每个切片内容的名称
·保存为Web所用格式，选中所有的切片内容，然后进行统一的设置，比如保存的格式，品质等
13、保存
·存储所需内容（三个快捷键连用：复制Ctrl+C、新建Ctrl+N、粘贴Ctrl+V）
新建时背景内容选择透明
·存储为Web所用格式（Ctrl+Shift+Alt+S）
-当图片颜色丰富且无透明要求时，建议保存为JPG格式并选择合适的品质，一般为60-80
-当图片颜色不太丰富时，无论有无透明要求，建议保存为PNG8格式，保存时设置 无仿色，无杂边（可以把这种设置保存起来，方便下次使用）
-当图片有半透明要求，保存为PNG24（对图片不进行压缩，所以文件较大）
14、修改和维护
a.要继续放更多的图标则需要更改画布大小，定位选择在左上角，可以使得已经在使用的图片不用修改CSS
b.移动图标
若图标为独立的图层，直接用移动工具；
若图标为非独立图层，用矩形选框工具选择需要移动的图标，然后移动到合适的位置，再用剪切（Ctrl+X），再用粘贴（Ctrl+V），就能把需要移动的图标建立在新图 层上；
c.要减小画布到指定区域（矩形选框工具、裁剪工具）
为了增加可维护性，画布一般要稍大于图像内容。
15、PNG8格式的颜色模式默认为索引颜色，在修改时需更改颜色模式为RGB颜色
16、图片合并方案
a.Sprite拼图，好处：减少网络请求，提升页面加载速度
b.压缩工具
有损：TinyPng(在线网站)
c.合并( 图片之间必须保留空隙)
-图片排列方式：横向排列 纵向排列
-合并与分类
·把同属于一个模块的图片合并
·把大小相似的图片合并
·把颜色相近的图片合并
·综合以上方式合并
d.合并推荐
-只本页用到的图片合并
-有状态的图标合并
17、浏览器兼容的方案
-IE6不支持PNG24半透明，则存两份图标，对高级浏览器保存一份PNG24的，对IE6保存一份PNG8的
-让高级浏览器使用CSS3，让低级浏览器用切图+骇客，或者优雅降级原则，都用CSS3处理，让低版本浏览器没有这种效果。如让高级浏览器使用圆角效果，让不支持的浏览器使用直角效果