本文详细介绍Photoshop CC 2014中前端工程师必备的PS技能，包括界面设置、工具操作及快捷键等内容，帮助读者掌握高效切图技巧。
PS CC 2014 For Windows下载地址:
64位: http://pan.baidu.com/s/1vT6zG
32 位: http://pan.baidu.com/s/1gd3kQI3
破解补丁: http://pan.baidu.com/s/1jG2yNXG
安装与破解教程: http://tieba.baidu.com/p/3118897260
一.前端工程师必备的PS技能——切图篇【2016-6-9】
界面设置：
1.从“窗户”中调处“信息”
2.“编辑”-“首选项”-“单位与标尺”，把标尺和文字的单位都改为“像素”
“编辑”-“首选项”-“增效工具”，把“启用生成器勾上”
3.“视图”-“显示”-“智能参考线” 把其选中
4.“文字”-"面板"-“字符面板” 调处字符面板
5.把“历史记录”放到右侧常用的地方”
6.关闭“通道、色板、调整、样式、路径”这些不常用关掉
7.“窗口”-“信息”，把 信息 调处来，用来实时显示鼠标坐标和选取的长宽
8.“视图”-选中“标尺”，让标尺线显示出来
9.“文件”-“生成”-“图像资源” 勾上
PS工具基本操作，简单工具操作
1.移动工具：快捷键“V” 就是移动图片或者选区
对于psd文件：按住“Ctrl”然后点击图层，会自动跳到该图层下
2.选框工具：快捷键“M”
2.1矩形选框工具： 按住“Shift”键，可以画正方形
2.2椭圆选框工具： 按住“Shift”键，可以画圆形， 同时组合“alt”键，可以获取圆心
2.3单行选框工具： 一行，是一个像素
2.4单列选框工具： 一列，是一个像素
同时， 他们都有“选区相加、相减”
3.套索工具 “L”
3.1套索工具：按住“ctrl”键，按下鼠标左键，沿着图片拉 快捷键“W”
3.2多边形套索工具：
3.3磁性套索工具：
他们都有“选区相加相减”，可以组合使用， 利用快捷键“Shift”键是选区相加，“Alt”键是选区相减
4.快速选择工具 “W”
4.1快速选择工具：按住“ctrl”键，可以选定选区，同时结合左上角的“选区相加相减”来选中后 切图
4.2魔棒工具： 同时也能进行 切图
5.裁剪工具("C")：在图片中裁剪到只需要的图像，然后进行操作
5.3切片工具： 可以在图片上将要切的图片实现切好，然后存储为web格式的就会显示出来
快速切图：选中“切片工具”点击上面的“基于参考线的切图”，然后，“文件”-“脚本”-“将图层导出到文件”
6.吸管工具("I")： 吸取需要的颜色
-----------（下面8个是常用的处理图片的 处理工具）
7.修补工具（"J"）
7.1.污点修复画笔： 直接对要去掉的污点进行涂抹，就会被删除
7.2.修复画笔工具： 利用"alt"键，获取焦点，可以在其他地方对该图片进行仿制出来
7.3.修补工具： 圈住污点，然后利用移动工具往其他地方拖
8.画笔工具 （B）[挺重要]
8.3.颜色替换工具： 可以利用这个变换前景色之后，给图标或者背景以及前景色进行换色，再结合其他工具："取样连续"、限制、模式，组合使用
9.图章工具 （S）
9.1.仿制图章工具：利用"alt"键，获取要仿制图像的焦点， 然后可以在其他地方对该图片进行仿制出来，
10.历史记录工具（Y）
10.1.历史记录画笔工具： 美化麻子脸，利用 “滤镜-模糊-高斯模糊”，然后“历史记录” 来进行美化
11.橡皮擦工具（E）,背景橡皮擦工具，魔术橡皮擦工具
12.渐变工具（G）,结合左上角的“渐变分类”工具， 按住“Shift”键，可以拉直线
13.模糊工具（），边界会变得模糊，再上面设置“强度”
13.2.锐化工具，瞄过后会显得很粗糙
13.3.涂抹工具,可以用来拉长 眼睫毛
14.减淡工具：可以用来相册图片的 美白
14.2加深工具
---------
15.钢笔工具（P）
15.1.钢笔工具：
15.2.自由钢笔工具：
15.3.添加锚点
15.4.删除锚点
15.5.转换点工具
16.文字工具（T）
16.1.横排文字工具：写出来的文字一般会有描边， 但是cc2014版，提供了一种windows字体格式，因此下载安装cc2014
16.3蒙版横排文字工具： 可以用来制作渐变颜色的文字， 或者填充各种各样的颜色
17.路径选择工具（A）
17.1直接选择工具
18.矩形工具 （快捷键“U”）
18.1.矩形工具
18.2.圆角矩形工具 然后在上部，或者属性里面调整 宽、高、半径、填充颜色、描边。 选择“形状”的时候PS会自动填充前景色，选择“路径”时会避免这种情况
18.3.椭圆工具
18.4.多边形工具
18.5.直线工具 按住Shift键，拉出直线
18.6.自定义形状工具 里面有很多形状工具，可以拉出，填充自定义颜色
19.抓手工具（快捷键“H”）
19.1.抓手工具，移动画布 ，可以结合 空格键 对画布进行移动
19.2.旋转视图工具 （快捷键“R”），对图像进行旋转
20.缩放工具（快捷键“Z”）
同时结合左上角的 放大、缩小按钮，对图像进行放大缩小
快捷键：
前景色填充： “Alt”+“Delete”键
背景色填充： “Ctrl”+"Delete"键
复制图层： 鼠标放到移动工具上 然后 按住“Alt”键，往外拉
变化选区，
PS CC2014扩展知识介绍:
一.自动切图
针对PSD文件的操作
1.“Ctrl”+ 将左上角的“组”切换成“图层”+ 点击图层， 会精确的定位到自己点击的图层，可以进行移动等的操作
2.针对psd文件的精准切图，以及将图层导出到文件
快速切图：选中“切片工具”点击上面的“基于参考线的切图”，然后，“文件”-“脚本”-“将图层导出到文件”
3.“文件”-“生成”-“图像资源” 勾上
然后对 需要的图层，将其重命名一下 图片格式(.jpg .png)， 就会在-assent文件的里面生成改图片
介绍SVG和Webp格式的导出技巧
4.ps也可以保存为“svg”格式的 ".svg"格式的图 需要看其里面的代码， 可以用sublime或者其他的打开
二.抽出资源：
导出SVG的办法： 选中图层-“文件-抽出资源” 然后进行设置
三.复制CSS
介绍ps cc自动生成css的方法
1.选中图层后 点击“图层”-“复制css”
四.图层管理
介绍如何对psd中的大量图层进行分类管理
1.在右侧“图层”选框中 有类型、名称、颜色 等 分类
跟吕静学习的切图技巧：
1.斜角：“新建一个图层”-“矩形工具”画一个小图-“直接选择工具”选中点后移动鼠标；
2.圆角按钮： 可以利用“圆角矩形工具”，设置好角的大小
3.透明背景图： 新建图层之后然后设置“不透明度”
4.带尖角的图片：亦可以用“斜角”进行做
64位: http://pan.baidu.com/s/1vT6zG
32 位: http://pan.baidu.com/s/1gd3kQI3
破解补丁: http://pan.baidu.com/s/1jG2yNXG
安装与破解教程: http://tieba.baidu.com/p/3118897260
一.前端工程师必备的PS技能——切图篇【2016-6-9】
界面设置：
1.从“窗户”中调处“信息”
2.“编辑”-“首选项”-“单位与标尺”，把标尺和文字的单位都改为“像素”
“编辑”-“首选项”-“增效工具”，把“启用生成器勾上”
3.“视图”-“显示”-“智能参考线” 把其选中
4.“文字”-"面板"-“字符面板” 调处字符面板
5.把“历史记录”放到右侧常用的地方”
6.关闭“通道、色板、调整、样式、路径”这些不常用关掉
7.“窗口”-“信息”，把 信息 调处来，用来实时显示鼠标坐标和选取的长宽
8.“视图”-选中“标尺”，让标尺线显示出来
9.“文件”-“生成”-“图像资源” 勾上
PS工具基本操作，简单工具操作
1.移动工具：快捷键“V” 就是移动图片或者选区
对于psd文件：按住“Ctrl”然后点击图层，会自动跳到该图层下
2.选框工具：快捷键“M”
2.1矩形选框工具： 按住“Shift”键，可以画正方形
2.2椭圆选框工具： 按住“Shift”键，可以画圆形， 同时组合“alt”键，可以获取圆心
2.3单行选框工具： 一行，是一个像素
2.4单列选框工具： 一列，是一个像素
同时， 他们都有“选区相加、相减”
3.套索工具 “L”
3.1套索工具：按住“ctrl”键，按下鼠标左键，沿着图片拉 快捷键“W”
3.2多边形套索工具：
3.3磁性套索工具：
他们都有“选区相加相减”，可以组合使用， 利用快捷键“Shift”键是选区相加，“Alt”键是选区相减
4.快速选择工具 “W”
4.1快速选择工具：按住“ctrl”键，可以选定选区，同时结合左上角的“选区相加相减”来选中后 切图
4.2魔棒工具： 同时也能进行 切图
5.裁剪工具("C")：在图片中裁剪到只需要的图像，然后进行操作
5.3切片工具： 可以在图片上将要切的图片实现切好，然后存储为web格式的就会显示出来
快速切图：选中“切片工具”点击上面的“基于参考线的切图”，然后，“文件”-“脚本”-“将图层导出到文件”
6.吸管工具("I")： 吸取需要的颜色
-----------（下面8个是常用的处理图片的 处理工具）
7.修补工具（"J"）
7.1.污点修复画笔： 直接对要去掉的污点进行涂抹，就会被删除
7.2.修复画笔工具： 利用"alt"键，获取焦点，可以在其他地方对该图片进行仿制出来
7.3.修补工具： 圈住污点，然后利用移动工具往其他地方拖
8.画笔工具 （B）[挺重要]
8.3.颜色替换工具： 可以利用这个变换前景色之后，给图标或者背景以及前景色进行换色，再结合其他工具："取样连续"、限制、模式，组合使用
9.图章工具 （S）
9.1.仿制图章工具：利用"alt"键，获取要仿制图像的焦点， 然后可以在其他地方对该图片进行仿制出来，
10.历史记录工具（Y）
10.1.历史记录画笔工具： 美化麻子脸，利用 “滤镜-模糊-高斯模糊”，然后“历史记录” 来进行美化
11.橡皮擦工具（E）,背景橡皮擦工具，魔术橡皮擦工具
12.渐变工具（G）,结合左上角的“渐变分类”工具， 按住“Shift”键，可以拉直线
13.模糊工具（），边界会变得模糊，再上面设置“强度”
13.2.锐化工具，瞄过后会显得很粗糙
13.3.涂抹工具,可以用来拉长 眼睫毛
14.减淡工具：可以用来相册图片的 美白
14.2加深工具
---------
15.钢笔工具（P）
15.1.钢笔工具：
15.2.自由钢笔工具：
15.3.添加锚点
15.4.删除锚点
15.5.转换点工具
16.文字工具（T）
16.1.横排文字工具：写出来的文字一般会有描边， 但是cc2014版，提供了一种windows字体格式，因此下载安装cc2014
16.3蒙版横排文字工具： 可以用来制作渐变颜色的文字， 或者填充各种各样的颜色
17.路径选择工具（A）
17.1直接选择工具
18.矩形工具 （快捷键“U”）
18.1.矩形工具
18.2.圆角矩形工具 然后在上部，或者属性里面调整 宽、高、半径、填充颜色、描边。 选择“形状”的时候PS会自动填充前景色，选择“路径”时会避免这种情况
18.3.椭圆工具
18.4.多边形工具
18.5.直线工具 按住Shift键，拉出直线
18.6.自定义形状工具 里面有很多形状工具，可以拉出，填充自定义颜色
19.抓手工具（快捷键“H”）
19.1.抓手工具，移动画布 ，可以结合 空格键 对画布进行移动
19.2.旋转视图工具 （快捷键“R”），对图像进行旋转
20.缩放工具（快捷键“Z”）
同时结合左上角的 放大、缩小按钮，对图像进行放大缩小
快捷键：
前景色填充： “Alt”+“Delete”键
背景色填充： “Ctrl”+"Delete"键
复制图层： 鼠标放到移动工具上 然后 按住“Alt”键，往外拉
变化选区，
PS CC2014扩展知识介绍:
一.自动切图
针对PSD文件的操作
1.“Ctrl”+ 将左上角的“组”切换成“图层”+ 点击图层， 会精确的定位到自己点击的图层，可以进行移动等的操作
2.针对psd文件的精准切图，以及将图层导出到文件
快速切图：选中“切片工具”点击上面的“基于参考线的切图”，然后，“文件”-“脚本”-“将图层导出到文件”
3.“文件”-“生成”-“图像资源” 勾上
然后对 需要的图层，将其重命名一下 图片格式(.jpg .png)， 就会在-assent文件的里面生成改图片
介绍SVG和Webp格式的导出技巧
4.ps也可以保存为“svg”格式的 ".svg"格式的图 需要看其里面的代码， 可以用sublime或者其他的打开
二.抽出资源：
导出SVG的办法： 选中图层-“文件-抽出资源” 然后进行设置
三.复制CSS
介绍ps cc自动生成css的方法
1.选中图层后 点击“图层”-“复制css”
四.图层管理
介绍如何对psd中的大量图层进行分类管理
1.在右侧“图层”选框中 有类型、名称、颜色 等 分类
跟吕静学习的切图技巧：
1.斜角：“新建一个图层”-“矩形工具”画一个小图-“直接选择工具”选中点后移动鼠标；
2.圆角按钮： 可以利用“圆角矩形工具”，设置好角的大小
3.透明背景图： 新建图层之后然后设置“不透明度”
4.带尖角的图片：亦可以用“斜角”进行做
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
