PS切图(一)
Photoshop界面设置
新建文件Ctrl+N,其中【预设】-【web】,【宽度】-【1920】,高度不定。【背景内容】-【透明】,也可存储为预设。

移动设置(V)

建议不勾选【自动选择】,选择【图层】,当我们选中某一个位置时,按住Ctrl,在PSD大图上单击相应位置,右下方图层列表会自动跳到相应的图层。也可以在图层列表中,按住Ctrl,并单击该图,PSD大图上会形成选区。视图设置
勾选【视图】-【智能参考线】和【标尺】,不勾选【窗口】-【库】和【颜色】

调整右侧

点击属性,关闭。

勾选【窗口】-【信息】和【字符】,并关闭段落和属性。

将信息和字符都拉到右侧,如下图

设置信息中单位为像素,颜色模式为RGB模式


在【编辑】-【首选项】-【单位与标尺】中单位设置为像素

最后,完成设置,存储为工作区,保存当前设置。【窗口】-【工作区】-【新建工作区】

Photoshop基本操作
简单工具操作
移动工具(V)
当按住Ctrl,选中多个图层,如下图:

菜单栏下方显示属性,包含对齐方式

选区工具(M)
选区工具+ - x框。

单行、单列选框工具都是1px。

重要的【shift键】,选框时,按住shift,可成正方形选框或者正圆。(注意先放鼠标,再放shift键)

重要的【Alt键】,设置圆心,鼠标点击某个位置,并按住Alt键,再拖动。(可配合shift键画正圆)

shift 键又等价于选区工具+,Alt键等价于选区工具-
shift+M在
和
之间切换。套索工具(L)
也是选区的,选择不规则图形。

多边形套索工具,在每条边的顶点单击一下,最后一个点双击,或者在起始点处单击,就能闭合多边形了。(注意鼠标箭头带圆圈表闭合)

磁性套索工具,根据颜色边界来进行判断。快速选择工具(W)
单击时,会把相同颜色的区域选择出来,还可以拉动再选择。
[键 缩小快速选择工具的画笔, ]键 放大画笔。同时也可以在菜单栏下方设置,如图

裁剪工具(C)
选择裁剪工具,单击画布时,会发现整个画布周围多了一些小的可控角。可控制裁剪区域面积。点击对勾,确认裁剪。保存-导出

用选框工具选中区域后,再单击裁剪工具(围绕选区,生成最小裁剪矩形),按下回车键,进行选区裁剪。其他快捷键
按住空格键----------------抓手工具
Ctrl和+ ---------------------放大
Ctrl和- ----------------------缩小
Ctrl和D ---------------------删除选区
Alt和Delete ----------------前景色填充
Ctrl和Delete ---------------背景色填充
图层的原理及其操作
图层相当于一层层玻璃,每层上都画了不同的图案,然后眼睛从上往下看。
参考线及其操作
【视图】-【新建参考线】或Alt -> V -> E或Ctrl+R。

选择当前图层,再拖动参考线,它会自动吸附到边缘。
【视图】-【显示】-【网格】
Ctrl+; 关闭参考线 Alt->V->E->H水平参考线。
PS切图(一)的更多相关文章
- 页面制作部分之PS切图
页面制作部分之PS切图 <--本标签下,通过页面制作.页面架构.javascript程序设计.DOM编程艺术.产品前端架构五部分来分享总结笔记,总结笔记会陆续分享--> 网页设计在技术层面 ...
- 做一个会PS切图的前端开发
系列链接 做一个会使用PS的前端开发 做一个会PS切图的前端开发 切图方法分类 PhotoShop从CS版本演变到现在的CC版本,切图功能发生了比较大的变化,我们可以把PhotoShop CS版本时的 ...
- 前端技术-PS切图
页面制作部分之PS切图 <--本标签下,通过页面制作.页面架构.javascript程序设计.DOM编程艺术.产品前端架构五部分来分享总结笔记,总结笔记会陆续分享--> 网页设计在技术层面 ...
- 学习笔记2:前端PS切图
前端PS切图 一.Photoshop的界面设置 二.Photoshop的基本操作 三.Photoshop的传统切图 四.Photoshop的精准切图 五.Photoshop的扩展知识 视频学习:htt ...
- PS切图保存后的背景图为透明
1.若想PS切图保存后的背景图为透明,那么则需要在如下图中所示的修改即可,切图后[文件]——>[存储为web格式]——>[PNG-24]: 2.要想在css中的背景图片为相通,则先剪切一个 ...
- 前端PS切图
http://www.imooc.com/learn/506 慕课网地址 Tools Tools Photoshop 快捷键 l 移动工具 V l 选取工具 M l 套索工具 L l ...
- ps切图插件
ps切图工具插件 下载网址:http://www.cutterman.cn/zh/cutterman 安装完插件,关闭ps,重新打开,窗口- 扩展,即可使用
- 两种ps切图方法(图层/切片)
两种Ps切图方法 一. 基础操作: a) Ctrl++ 放大图片,ctrl - -缩小图片 b) 按住空格键space+,点击鼠标左键,拖动图片. c) 修改单位,点击编辑 ...
- 2018年设计师都在用的PS切图插件--摹客iDoc
终于找到你,我梦寐以求的PS切图插件.曾几何时,设计师在完成设计稿之后高效的输出标注切图一直是设计师的噩梦.为什么这么说呢?开发要的那么多尺寸,我到底该怎么切图?iPhone的版本已经不少了,更别提安 ...
- 前端菜鸟起飞之学会ps切图
由于之前只顾着追求效率,没有学习过PS,但其实这是前端开发人员需要学会的技能之一,曾经看过一个大佬的前端经验分享说他在招聘时遇到不会切图的会直接pass掉,可见前端开发人员学会切图是多么重要.通过观看 ...
随机推荐
- 断电不断网——Linux的screen
title: 断电不断网--Linux的screen author:青南 date: 2015-01-01 20:20:23 categories: [Linux] tags: [linux,scre ...
- JavaScript语言精粹--Function,类,this,对象
1.类与对象 在JS中,创建对象(Create Object)并不完全是我们时常说的创建类对象,JS中的对象强调的是一种复合类型,JS中创建对象及对对象的访问是极其灵活的. JS对象是一种复合类型,它 ...
- .NET 开源SqlServer ORM框架 SqlSugar 3.0 API
3.1.x ,将作为3.X系统的最后一个版本,下面将会开发 全新的功能 更新列表:https://github.com/sunkaixuan/SqlSugar/releases 优点: SqlSuga ...
- 来,一起让我们越来越懒,面向CSS、JS未来编程。(9.28已更新)
2016.10.29更新 本文存在大量的错误,仅供参考. 不知不觉在前端领域马上一个年头就要过去了,然而再看看自己的代码,果然够烂,那么为什么代码一直没有用面向对象的思维去写CSS呢?首先有两点:一点 ...
- 创建或打开解决方案时提示"DotNetCore.1.0.1-SDK.1.0.0.Preview2-003131-x86"错误的解决方案
提示"DotNetCore.1.0.1-SDK.1.0.0.Preview2-003131-x86"错误的解决方案: 1.检查是否有C:\Program Files (x86)\d ...
- C#开发微信门户及应用(26)-公众号微信素材管理
微信公众号最新修改了素材的管理模式,提供了两类素材的管理:临时素材和永久素材的管理,原先的素材管理就是临时素材管理,永久素材可以永久保留在微信服务器上,微信素材可以在上传后,进行图片文件或者图文消息的 ...
- 是时候 UWP 了 !
什么是 UWP? 很多程序员都有一个梦想:希望自己开发的软件能够轻而易举的在所有平台上运行,而不是把同样的需求,用不同的技术.工具重新开发才能够运行在所有平台上.这就是跨平台,很多软件从业者都在为这个 ...
- Be a new gentlemen
学好技术的同时,更要注重自身素养的提升! 一 .有则改之,无责加冕 1.女士优先 2. 不随地吐痰, 不乱扔垃圾, 不在人群中抽烟 3. 不大声喧哗 4. 不插队,碰到别人要说抱歉 5. 不在公共交 ...
- Java中的多线程你只要看这一篇就够了
学习Java的同学注意了!!! 学习过程中遇到什么问题或者想获取学习资源的话,欢迎加入Java学习交流群,群号码:279558494 我们一起学Java! 引 如果对什么是线程.什么是进程仍存有疑惑, ...
- 用C++实现的贪吃蛇游戏
我是一个C++初学者,控制台实现了一个贪吃蛇游戏. 代码如下: //"贪吃蛇游戏"V1.0 //李国良于2016年12月29日编写完成 #include <iostream& ...