PS切图

Posted wyb666

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了PS切图相关的知识,希望对你有一定的参考价值。

内容:

1.PS安装与基本使用

2.PS切图

 

 

 

参考:https://www.imooc.com/learn/506

 

1.PS安装与基本设置

(1)什么是PS

Adobe Photoshop,简称“PS”,是由Adobe Systems开发和发行的图像处理软件。
Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具,可以有效地进行图片编辑工作。ps有很多功能,在图像、图形、文字、视频、出版等各方面都有涉及

 

(2)PS破解安装

安装包下载:https://pan.baidu.com/s/1VFTaZEtiplVeYC12ypoZsw 密码:85di

 

(3)基本设置

ps界面设置:

点击新建,然后选择如下:

技术分享图片

选择完之后可以选择存储预设(存储选择下次直接用),然后点击确定即可 ,之后会出现如下画面:

技术分享图片

然后我们可以使用打开,打开一个psd文件,如下所示:

技术分享图片

 

移动工具设置:

移动工具就是PS快捷键中的第一个工具:

技术分享图片

 

视图设置:

在视图选项中选择显示,然后勾选上智能参考线,另外还要在视图中勾上标尺

 

其他设置:

把右上角的一大堆东西关闭只留下以下四个(没有的在视图中找):

技术分享图片

设置信息的面板选项,选中信息,点击右上角,选中面板选项设置如下所示:

技术分享图片

设置编辑中的首选项中的单位与标尺中的单位均为像素:

技术分享图片

 

 

2.PS切图

(1)前端为什么要学切图

UI给我们设计图的时候都会有一份设计原稿psd文件,有的公司可能UI会把需要的图标给切好,更多时候是需要我们自己来切的。而且,有的时候可能需要的东西UI没有切出来,你就要去是去找UI切好了再发给我们,这个过程就变得很麻烦,所以不如自己学一些切图方法 

 

(2)切图的目的

从psd文件中获取我们想要的资源

 

(3)开始切图

技术分享图片

删除多余的参考线:

上面的图片中很多条蓝色的参考线,这些线是设计人员用来设计用的,有的文件中的线会直接把我们需要切的东西给包裹出来,但是像我们练习的这个文件中的参考线特别的多,特别的密集,很多我们都不需要,所以我们先把这些参考线都清除掉。

删除参考线:选择移动工具,然后把要删除的参考线往标尺上拖,往上或者往左都可以

没有参考线的可能是参考线被隐藏了,通过“CTRL”+ “;”就可以显示出来 

选择要切的图标:

 



以上是关于PS切图的主要内容,如果未能解决你的问题,请参考以下文章

两种快速切图方式

ps 切图 3 切图

第144天:PS切图方法总结

做一个会PS切图的前端开发

前端之PS切图

PS怎么切图/切片如何切图