使用Photoshop切图的三种方式
PhotoShop切图的三种方式
1. 原始切图
(1)选择工具栏中的切片工具
![](https://upload-images.jianshu.io/upload_images/11086259-76661c1c7fdac961.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
(2)找到要切片的元素,在右侧的图层框中,使元素背景隐藏,然后用切片工具选择需要切片的元素
![](https://upload-images.jianshu.io/upload_images/11086259-e13cb045e12cd0d0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/582)
![](https://upload-images.jianshu.io/upload_images/11086259-31e362878ff30156.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
![](https://upload-images.jianshu.io/upload_images/11086259-6d88dae1d52991f9.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/665)
(3)导出为web常用格式,一般为png-24。
![](https://upload-images.jianshu.io/upload_images/11086259-5fcd1e080363ac2e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
![](https://upload-images.jianshu.io/upload_images/11086259-49e7e452bfc2ab0f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
(4)切图结果
![](https://upload-images.jianshu.io/upload_images/11086259-2b6e28eabef46f8c.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
2. 基于参考线的切图
(1)设置显示参考线和标尺
视图->显示->参考线
![](https://upload-images.jianshu.io/upload_images/11086259-eee2c99aa37c7646.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/529)
视图->标尺
![](https://upload-images.jianshu.io/upload_images/11086259-3d253b3f1eacf820.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
(2)画参考线
![](https://upload-images.jianshu.io/upload_images/11086259-6451e6906633791a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/338)
(3)选择切片工具,点击属性栏中的“基于参考线的切片”
![](https://upload-images.jianshu.io/upload_images/11086259-886426279fa26c1b.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/363)
(4)导出。
3. 自动切图
(1)选择文件->导出->将图层导出到文件。
![](https://upload-images.jianshu.io/upload_images/11086259-c416613e7194853c.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
(2)选择导出格式和其他配置项,运行。
![](https://upload-images.jianshu.io/upload_images/11086259-b89c7f9cafc59855.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/507)
(3)photoshop自动导出所有图层的切片,速度可能较慢。