1、通常UI设计出来的界面都被保存为.psd文件（PhotoShop Document），这里找到一个简单的示例.psd文件并且使用PhotoShop工具打开并且找到需要切图的图片元素
2、在打开的PhotoShop窗口左侧工具栏中选择裁剪工具，右键点击裁剪工具会打开裁剪工具的右键菜单，选择第三个切图工具
3、鼠标变成切图工具图标后从切图图标的左上角到右下角斜拉出一个正方形框，这号包裹住要切的图标，松开鼠标后图片变成如图的样子
4、接着点击PhotoShop菜单栏的File->Save As Web...菜单项，也就是保存为Web类型
5、在打开的保存为Web对话框中选择保存图片为png格式，接着点击保存按钮
6、在保存配置对话框中选择保存为HTML和图片，切片选择所有切片，接着点击保存按钮
7、进入前面保存Web对话框中的路径，查看图片目录，发现切图的按钮图标在切片文件夹中，其他的切片是无用的
