ps切图

作者: 兔子___ | 来源:发表于2018-07-20 11:55 被阅读0次

ps


ps首选项设置

编辑 > 首选项 > 单位与标尺 > 把文字和标尺设置成像素单位 > 确定

放大图片:”CTRL” +“+”

缩小图片:“CTRL”+ “-”

标尺Ctrl+R

参考线Ctrl + ;

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

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

切图:(缺点:切出的图片有底色)

①选择工具栏第一个“移动工具”

②然后查看上面选项栏“自动选择”有没有被选中,没有被选中点击选中,将它旁边的“组”改为“图层”

③点击我们要切的图标,然后到右下角的图层面板,点击当前选中的这个图层旁边的小眼睛来隐藏当前图层,通过显隐来确定是不是我们要切的图标

④确认了要切的图标后,分别从水平和竖直标尺的地方拉取参考线来把图标给包裹住。

现在,我们已经用参考线把我们的图标给包裹出来了,下面,我们要用切片工具来切出我们的图标

①选择切片工具,左边工具栏从上往下数第五个,然后右键就可以找到,然后选中

②然后找到我们刚才用参考线包裹的图标,从左上角一直拖到右下角,因为有参考线的帮助,所以软件能够自动吸附到参考线上,所以只要大概找准左上角和右下角就可以选取出来

③用同样的方法把剩下的都选取出来

5.将切片存储为图片

①选择 “文件”=》“存储为Web所用格式”

②调整缩放比例,让图片能完整的在窗口显示

③在窗口中,从左上角一直拖到右下角,选中所有切片,这样才能把切片都存储为我们想要的格式

④存储为png-24格式,png-24格式的图片质量比较高

⑤保存,选择用户所有切片可以只保存我们自己切出来的切片

⑥然后查看保存的文件里面就多了一个images文件夹,里面就是我们切出来的图片

切图:(简单的切单张图片)

1.还是之前的文件,这次我们就切一个图标

2.选择移动工具,并在选项中选中“自动选择”和“图层”

3.点击我们要切的图标,这里是点击中间的笔,然后右边的图层面板就会自动聚焦到对应的图层,通过点击左边的小眼睛来确定是不是我们想要的图层。

4.这里我们找到了我们需要的图标有两部分组成,里面的笔和外面的圆,两个图层被放在了一个组里面

5.在icon文件上右键,选择“转换为智能对象”

6.然后,我们会发现,两个图层合并为了一个图层,这个就是我们需要的图标

7.在icon图层上右键,选择“编辑内容”,出现提示框的话直接点击“确定”即可

8.然后,我们的图标就被单独提取出来了

9.选择“文件”=》“存储为”,将我们的图标保存为PNG格式就大功告成了!

这节分享一个photoshop cc 开始有的自动生成图标的方法

1.打开给大家准备的psd文件

2.选择“编辑”=》“首选项”=》“增效工具”

3.勾选“启用生成器”,选择“确定”

4.重启一下photoshop

5.重启后,重新打开我们的文件,感觉参考线太碍事了,我们用快捷键“CTRL”+“;”把参考线隐藏了。

6.选择“文件”=》“生成”=》“图像资源”

7.用之前一样的方法找到我们要的图标的图层

8.我们需要的图标放在了icon这个分组中,现在我们将icon重命名为icon.png

9.现在我们打开我们存放psd文件的文件夹中,可以发现现在多了一个文件夹

10.打开这个多出来的文件夹就会看到我们的图标躺在那里了,是不是很激动!!!

请记住下面几条切图原则:

内容性的图片颜色比较丰富,那我们存为JPG格式情况比较多,必要的话要做一下压缩,保证图片不要太大。

对于修饰性的图片我们一般保存为PNG24格式或者是PNG8格式,两种格式都支持全透明,但是PNG24格式支持半透明的 ,PNG8不支持 。

相关文章

  • ps切图

    ps ps首选项设置 编辑 > 首选项 > 单位与标尺 > 把文字和标尺设置成像素单位 > 确定 放大图片:”CT...

  • ps切图

    按住ctrl鼠标左击图片上元素,右侧会高亮元素对应的图层 在图层上按住鼠标左键不放能拖动该图层到指定位置 多个图层...

  • ps切图

    1)清除参考线--- 视图->清除参考线 2)切图-----------图层->基于图层的切片1,使用切片工具Pa...

  • ps 切图

    本文以 PS CC 2015 为例 旨在熟悉简单的切图步骤,更为巧妙的切图技巧--请自行Google 搜索慕课网上...

  • PS切图

    ​ 因为网页美工大部分效果图都是利用 PS(Photoshop)来做的,所以以后我们大部分切图工作都是...

  • PS切图

    常用知识点 网页常用尺寸:1920px*1080px 快速使用工具栏工具的快捷键:先按Alt,菜单栏下部会出现短横...

  • PS切图

    除了用切片工具一个一个框起要切的部分进行分割,还可以使用参考线,使用参考线划分之后,会出现这样的按键 点击这个基于...

  • PS 切图

    一、安装和基本设置(二)界面设置: 视图:显现>智能参考线、标尺 窗口:设置四大常用选项卡:信息、字符、图层、历史...

  • ps切图

    切图 1、找到切片工具 2、导入psd后,找到要切的图片 把其他一些图片点掉,留下你要切的那个图层 3、保存 保存...

  • 网页(UI)设计--切图标注工具

    cutterman(免费)--切图(ps 插件) parker(收费)--标注(ps 插件) PxCook(免费)...

网友评论

      本文标题:ps切图

      本文链接:https://www.haomeiwen.com/subject/jlbfmftx.html