★ 传统网页切图的两种实现办法
1.直接利用“切片工具”；
2.设置“参考线” → “切片工具” → “基于参考线的切片”；
提示 为了切图的提高速度和准度，一般会将网页的psd图片分割成不同的部分，然后进行局部划分切片；
保存：制作好切片之后，ctrl + shift + alt + s （快捷键）“存储为Web所用格式”，图片保存一般选择“PNG-24”
★ 精准切图
△ 方法 1 利用“脚本”
是一种比较快捷准确的切图方法（PS CS6以上都支持），是将所有图层中的图像全部转储出来。（转储的图片格式还可以是svg，WebP等）
1，自动化切图，省时省力；2，计算机自动计算，尺寸更准确；
关键操作：文件 → 脚本 → 将图层导出到文件。。。
优点，可以一次性地批量将多图层的psd文件导出，同时可自定义的图片格式和图片名称。
△ 方法 2 利用“生成器”生成“图像资源”
（PS CC 开始支持自动化切图功能）
关键操作（三步走）：
a.编辑 → 首选项 → 增效工具 → 生成器；
b.文件 → 生成 → 图像资源；
c.选中目标图层 → 更改名称为“name.文件格式”就会自动在assets文件夹内生成该图层内相关图片指定格式的文件
完成操作设置以后，我们回到打开的psd文件所在的文件夹，会发现自动生成了一个assets文件，该文件就是用来存放自动切图生成的图片；
★ 拓展知识
“文件”选项卡中的“抽出资源”实现svg图像的导出（PS CC2014以后都支持）；
选中图层，然后鼠标右击，选中“复制CSS”将自动抽取指定图像并自动复制CSS代码；（生成代码的class名称即为图层的名称）
“图层管理”可以实现对psd文件中大量图层进行分类管理；
来源：https://www.cnblogs.com/Jener/p/6023055.html