互联网从业者前端开发工程师该了解的Photoshop介绍和切图技巧

时间：2023-07-06 10:36:01 | 来源：网站运营

时间：2023-07-06 10:36:01 来源：网站运营

互联网从业者前端开发工程师该了解的Photoshop介绍和切图技巧：点击查看原文

Photoshop介绍

Adobe Photoshop，简称"PS"，是由Adobe Systems开发和发行的图像处理软件。主要处理以像素所构成的数字图像(点阵图，或者位图)。它是世界顶级的图像处理软件，广泛应用于平面设计、网页设计、婚纱影楼、UI设计等等。

---

Photoshop常用工具介绍

1.整体界面介绍

2.文件打开和关闭(双击工作区打开图像)

3.放大镜工具(Ctrl+,Ctrl-)

4.手型工具(其他工具使用的同时按空格键)

5.移动选择工具

6.图层面板介绍

7.取色工具和前景色面板

8.矩形框选择工具和裁切工具

---

Photoshop常用切图和修图方法

1.切片工具和切片选择工具(C快捷键，shift+C切换)

2.存储为web所用格式用法介绍

3.常用修图方法(移去图像中不需要的内容)：

a.隐藏图层

b.选区拖动覆盖

---

网页制作常用图片格式

网页制作常用的图片格式为：jpg、gif、png。

网页效果图原文件常用格式为：psd 、 png。

Jpg ：一种有损压缩格式，是网页制作使用最多的图片格式，这种格式可以以不同

的压缩比来压缩图片，可以极大的减小图片的容量，从而减小图片在网页上的加载

时间。图像压缩率越大，图片的质量越差。网页制作中，图像压缩和图像质量间需

要达到一定平衡。

gif ：以 2、4、8、16 … 256 色存储单个光栅图像数据或多个光栅图像数据。gif图片

支持透明度、压缩、交错和多图像图片（动画 GIF）。GIF 透明度不是 alpha 通道透

明度，不能支持半透明效果，透明背景下边缘会有锯齿。

png ：一种试图替代GIF和TIFF的文件格式，它增加一些GIF文件格式所不具备的特

性。它使用从LZ77派生的无损数据压缩算法。Png可以存为半透明效果，透明背景

下边缘光滑，Png是Firework软件的默认格式，可以包含图层。

psd ：是Photoshop的专用格式，PSD文件可以存储成多种模式，还可以保存图层、

通道、路径等信息，是目前惟一能够支持全部图像色彩模式的格式。但体积庞大，

在大多平面软件内部可以通用。

---

PHOTOSHOP常用快捷键大全

一、文件

新建 CTRL+N

打开 CTRL+O

打开为 ALT+CTRL+O

关闭 CTRL+W

保存 CTRL+S

另存为 CTRL+SHIFT+S

另存为网页格式 CTRL+ALT+S

打印设置 CTRL+ALT+P

页面设置 CTRL+SHIFT+P

打印 CTRL+P

退出 CTRL+Q

---

二、编辑

撤消 CTRL+Z

向前一步 CTRL+SHIFT+Z

向后一步 CTRL+ALT+Z

退取 CTRL+SHIFT+F

剪切 CTRL+X

复制 CTRL+C

合并复制 CTRL+SHIFT+C

粘贴 CTRL+V

原位粘贴 CTRL+SHIFT+V

自由变换 CTRL+T

再次变换 CTRL+SHIFT+T

色彩设置 CTRL+SHIFT+K

---

三、图象

调整→色阶 CTRL+L

调整→自动色阶 CTRL+SHIFT+L

调整→自动对比度 CTRL+SHIFT+ALT+L

调整→曲线 CTRL+M

调整→色彩平衡 CTRL+B

调整→色相/饱和度CTRL+U

调整→去色 CTRL+SHIFT+U

调整→反向 CTRL+I

提取 CTRL+ALT+X

液化 CTRL+SHIFT+X

---

四、图层

新建图层 CTRL+SHIFT+N

新建通过复制的图层 CTRL+J

与前一图层编组 CTRL+G

取消编组 CTRL+SHIFT+G

合并图层 CTRL+E

合并可见图层 CTRL+SHIFT+E

---

五、选择

全选 CTRL+A

取消选择 CTRL+D

全部选择 CTRL+SHIFT+D

反选 CTRL+SHIFT+I

羽化 CTRL+ALT+D

---

六、滤镜

上次滤镜操作 CTRL+F

---

七、视图

校验颜色 CTRL+Y

色域警告 CTRL+SHIFT+Y

放大 CTRL++

缩小 CTRL+-

满画布显示 CTRL+0

实际像素 CTRL+ALT+0

显示附加 CTRL+H

显示网格 CTRL+ALT+'

显示标尺 CTRL+R

启用对齐 CTRL+；

琐定参考线 CTRL+ALT+；

---

八、窗口

关闭全部 CTRL+SHIFT+W

---

九、帮助

目录 F1

矩形、椭圆选框工具 【M】

裁剪工具 【C】

移动工具 【V】

套索、多边形套索、磁性套索 【L】

魔棒工具 【W】

喷枪工具 【J】

画笔工具 【B】

像皮图章、图案图章 【S】

历史记录画笔工具 【Y】

像皮擦工具 【E】

铅笔、直线工具 【N】

模糊、锐化、涂抹工具 【R】

减淡、加深、海棉工具 【O】

钢笔、自由钢笔、磁性钢笔 【P】

添加锚点工具 【+】

删除锚点工具 【-】

直接选取工具 【A】

文字、文字蒙板、直排文字、直排文字蒙板 【T】

度量工具 【U】

直线渐变、径向渐变、对称渐变、角度渐变、菱形渐变 【G】

油漆桶工具 【K】

吸管、颜色取样器 【I】

抓手工具 【H】

缩放工具 【Z】

默认前景色和背景色 【D】

切换前景色和背景色 【X】

切换标准模式和快速蒙板模式 【Q】

标准屏幕模式、带有菜单栏的全屏模式、全屏模式 【F】

临时使用移动工具 【Ctrl】

临时使用吸色工具 【Alt】

临时使用抓手工具 【空格】

打开工具选项面板 【Enter】

快速输入工具选项(当前工具选项面板中至少有一个可调节数字): 【0】至【9】

循环选择画笔 【[】或【]】

选择第一个画笔 【Shift】+【[】

选择最后一个画笔 【Shift】+【]】

建立新渐变(在”渐变编辑器”中) 【Ctrl】+【N】

---

文件操作

新建图形文件 【Ctrl】+【N】

用默认设置创建新文件 【Ctrl】+【Alt】+【N】

打开已有的图像 【Ctrl】+【O】

打开为... 【Ctrl】+【Alt】+【O】

关闭当前图像 【Ctrl】+【W】

保存当前图像 【Ctrl】+【S】

另存为... 【Ctrl】+【Shift】+【S】

存储副本 【Ctrl】+【Alt】+【S】

页面设置 【Ctrl】+【Shift】+【P】

打印 【Ctrl】+【P】

打开“预置”对话框 【Ctrl】+【K】

显示最后一次显示的“预置”对话框 【Alt】+【Ctrl】+【K】

设置“常规”选项(在预置对话框中) 【Ctrl】+【1】

设置“存储文件”(在预置对话框中) 【Ctrl】+【2】

设置“显示和光标”(在预置对话框中) 【Ctrl】+【3】

设置“透明区域与色域”(在预置对话框中) 【Ctrl】+【4】

设置“单位与标尺”(在预置对话框中) 【Ctrl】+【5】

设置“参考线与网格”(在预置对话框中) 【Ctrl】+【6】

设置“增效工具与暂存盘”(在预置对话框中) 【Ctrl】+【7】

设置“内存与图像高速缓存”(在预置对话框中) 【Ctrl】+【8】

---

编辑操作

还原/重做前一步操作 【Ctrl】+【Z】

还原两步以上操作 【Ctrl】+【Alt】+【Z】

重做两步以上操作 【Ctrl】+【Shift】+【Z】

剪切选取的图像或路径 【Ctrl】+【X】或【F2】

拷贝选取的图像或路径 【Ctrl】+【C】

合并拷贝 【Ctrl】+【Shift】+【C】

将剪贴板的内容粘到当前图形中 【Ctrl】+【V】或【F4】

将剪贴板的内容粘到选框中 【Ctrl】+【Shift】+【V】

自由变换 【Ctrl】+【T】

应用自由变换(在自由变换模式下) 【Enter】

从中心或对称点开始变换 (在自由变换模式下) 【Alt】

限制(在自由变换模式下) 【Shift】

扭曲(在自由变换模式下) 【Ctrl】

取消变形(在自由变换模式下) 【Esc】

自由变换复制的象素数据 【Ctrl】+【Shift】+【T】

再次变换复制的象素数据并建立一个副本:

【Ctrl】+【Shift】+【Alt】+【T】

删除选框中的图案或选取的路径 【DEL】

用背景色填充所选区域或整个图层 :

【Ctrl】+【BackSpace】或【Ctrl】+【Del】

用前景色填充所选区域或整个图层:

【Alt】+【BackSpace】或【Alt】+【Del】

弹出“填充”对话框 【Shift】+【BackSpace】

从历史记录中填充 【Alt】+【Ctrl】+【Backspace】

---

图像调整

调整色阶 【Ctrl】+【L】

自动调整色阶 【Ctrl】+【Shift】+【L】

打开曲线调整对话框 【Ctrl】+【M】

取消选择所选通道上的所有点(‘曲线’对话框中) 【Ctrl】+【D】

打开“色彩平衡”对话框 【Ctrl】+【B】

打开“色相/饱和度”对话框 【Ctrl】+【U】

全图调整(在色相/饱和度”对话框中) 【Ctrl】+【~】

只调整红色(在色相/饱和度”对话框中) 【Ctrl】+【1】

只调整黄色(在色相/饱和度”对话框中) 【Ctrl】+【2】

只调整绿色(在色相/饱和度”对话框中) 【Ctrl】+【3】

只调整青色(在色相/饱和度”对话框中) 【Ctrl】+【4】

只调整蓝色(在色相/饱和度”对话框中) 【Ctrl】+【5】

只调整洋红(在色相/饱和度”对话框中) 【Ctrl】+【6】

去色 【Ctrl】+【Shift】+【U】

反相 【Ctrl】+【I】

---

图层操作

从对话框新建一个图层 【Ctrl】+【Shift】+【N】

以默认选项建立一个新的图层 【Ctrl】+【Alt】+【Shift】+【N】

通过拷贝建立一个图层 【Ctrl】+【J】

通过剪切建立一个图层 【Ctrl】+【Shift】+【J】

与前一图层编组 【Ctrl】+【G】

取消编组 【Ctrl】+【Shift】+【G】

向下合并或合并联接图层 【Ctrl】+【E】

合并可见图层 【Ctrl】+【Shift】+【E】

盖印或盖印联接图层 【Ctrl】+【Alt】+【E】

盖印可见图层 【Ctrl】+【Alt】+【Shift】+【E】

将当前层下移一层 【Ctrl】+【[】

将当前层上移一层 【Ctrl】+【]】

将当前层移到最下面 【Ctrl】+【Shift】+【[】

将当前层移到最上面 【Ctrl】+【Shift】+【]】

激活下一个图层 【Alt】+【[】

激活上一个图层 【Alt】+【]】

激活底部图层 【Shift】+【Alt】+【[】

激活顶部图层 【Shift】+【Alt】+【]】

调整当前图层的透明度(当前工具为无数字参数的,如移动工具) :

【0】至【9】

保留当前图层的透明区域(开关) 【/】

投影效果(在”效果”对话框中) 【Ctrl】+【1】

内阴影效果(在”效果”对话框中) 【Ctrl】+【2】

外发光效果(在”效果”对话框中) 【Ctrl】+【3】

内发光效果(在”效果”对话框中) 【Ctrl】+【4】

斜面和浮雕效果(在”效果”对话框中) 【Ctrl】+【5】

应用当前所选效果并使参数可调(在”效果”对话框中):

【A】

图层混合模式

循环选择混合模式 【Alt】+【-】或【+】

正常 【Ctrl】+【Alt】+【N】

阈值（位图模式） 【Ctrl】+【Alt】+【L】

溶解 【Ctrl】+【Alt】+【I】

背后 【Ctrl】+【Alt】+【Q】

清除 【Ctrl】+【Alt】+【R】

正片叠底 【Ctrl】+【Alt】+【M】

屏幕 【Ctrl】+【Alt】+【S】

叠加 【Ctrl】+【Alt】+【O】

柔光 【Ctrl】+【Alt】+【F】

强光 【Ctrl】+【Alt】+【H】

颜色减淡 【Ctrl】+【Alt】+【D】

颜色加深 【Ctrl】+【Alt】+【B】

变暗 【Ctrl】+【Alt】+【K】

变亮 【Ctrl】+【Alt】+【G】

差值 【Ctrl】+【Alt】+【E】

排除 【Ctrl】+【Alt】+【X】

色相 【Ctrl】+【Alt】+【U】

饱和度 【Ctrl】+【Alt】+【T】

颜色 【Ctrl】+【Alt】+【C】

光度 【Ctrl】+【Alt】+【Y】

去色 海棉工具+【Ctrl】+【Alt】+【J】

加色 海棉工具+【Ctrl】+【Alt】+【A】

暗调 减淡/加深工具+【Ctrl】+【Alt】+【W】

中间调 减淡/加深工具+【Ctrl】+【Alt】+【V】

高光 减淡/加深工具+【Ctrl】+【Alt】+【Z】 选择功能

全部选取 【Ctrl】+【A】

取消选择 【Ctrl】+【D】

重新选择 【Ctrl】+【Shift】+【D】

羽化选择 【Ctrl】+【Alt】+【D】

反向选择 【Ctrl】+【Shift】+【I】

路径变选区 数字键盘的【Enter】

载入选区 【Ctrl】+点按图层、路径、通道面板中的缩约图

按上次的参数再做一次上次的滤镜 【Ctrl】+【F】

退去上次所做滤镜的效果 【Ctrl】+【Shift】+【F】

重复上次所做的滤镜(可调参数) :

【Ctrl】+【Alt】+【F】

选择工具(在“3D变化”滤镜中) 【V】

立方体工具(在“3D变化”滤镜中) 【M】

球体工具(在“3D变化”滤镜中) 【N】

柱体工具(在“3D变化”滤镜中) 【C】

轨迹球(在“3D变化”滤镜中) 【R】

全景相机工具(在“3D变化”滤镜中) 【E】

视图操作

显示彩色通道 【Ctrl】+【~】

显示单色通道 【Ctrl】+【数字】

显示复合通道 【~】

以CMYK方式预览(开关) 【Ctrl】+【Y】

打开/关闭色域警告 【Ctrl】+【Shift】+【Y】

放大视图 【Ctrl】+【+】

缩小视图 【Ctrl】+【-】

满画布显示 【Ctrl】+【0】

实际象素显示 【Ctrl】+【Alt】+【0】

向上卷动一屏 【PageUp】

向下卷动一屏 【PageDown】

向左卷动一屏 【Ctrl】+【PageUp】

向右卷动一屏 【Ctrl】+【PageDown】

向上卷动10 个单位 【Shift】+【PageUp】

向下卷动10 个单位 【Shift】+【PageDown】

向左卷动10 个单位 【Shift】+【Ctrl】+【PageUp】

向右卷动10 个单位 【Shift】+【Ctrl】+【PageDown】

将视图移到左上角 【Home】

将视图移到右下角 【End】

显示/隐藏选择区域 【Ctrl】+【H】

显示/隐藏路径 【Ctrl】+【Shift】+【H】

显示/隐藏标尺 【Ctrl】+【R】

显示/隐藏参考线 【Ctrl】+【;】

显示/隐藏网格 【Ctrl】+【”】

贴紧参考线 【Ctrl】+【Shift】+【;】

锁定参考线 【Ctrl】+【Alt】+【;】

贴紧网格 【Ctrl】+【Shift】+【”】

显示/隐藏“画笔”面板 【F5】

显示/隐藏“颜色”面板 【F6】

显示/隐藏“图层”面板 【F7】

显示/隐藏“信息”面板 【F8】

显示/隐藏“动作”面板 【F9】

显示/隐藏所有命令面板 【TAB】

显示或隐藏工具箱以外的所有调板 【Shift】+【TAB】

文字处理(在”文字工具”对话框中)

左对齐或顶对齐 【Ctrl】+【Shift】+【L】

中对齐 【Ctrl】+【Shift】+【C】

右对齐或底对齐 【Ctrl】+【Shift】+【R】

左／右选择 1 个字符 【Shift】+【←】/【→】

下／上选择 1 行 【Shift】+【↑】/【↓】

选择所有字符 【Ctrl】+【A】

将所选文本的文字大小减小2 点象素 【Ctrl】+【Shift】+【<】

将所选文本的文字大小增大2 点象素 【Ctrl】+【Shift】+【>】

将所选文本的文字大小减小10 点象素 【Ctrl】+【Alt】+【Shift】+【<】

将所选文本的文字大小增大10 点象素 【Ctrl】+【Alt】+【Shift】+【>】

将行距减小2点象素 【Alt】+【↓】

将行距增大2点象素 【Alt】+【↑】

将基线位移减小2点象素 【Shift】+【Alt】+【↓】

将基线位移增加2点象素 【Shift】+【Alt】+【↑】

将字距微调或字距调整减小20/1000ems :

【Alt】+【←】

将字距微调或字距调整增加20/1000ems :

【Alt】+【→】

将字距微调或字距调整减小100/1000ems:

【Ctrl】+【Alt】+【←】

将字距微调或字距调整增加100/1000ems :

【Ctrl】+【Alt】+【→】

选择通道中白的像素（包括半色调）:

【Ctrl】+【Alt】+【1~9】