- 面板
- 视图
- 工具
前端常常从设计稿中切除网页的素材并在代码中引入图片 (复杂的图片或者解决兼容问题)，
所以经常利用Photoshop将设计稿 (.psd) -> 产出物 (png, *.jpg)。
面板
在全局设置下将单位修改为像素，因其在 CSS 中运用最广 (Preference -> Units & Rulers -> Units) 。设置工作区布局为切图及图片编辑做准备（所需窗口为信息窗口，图层窗口以及历史记录窗口）。
打开『信息窗口』、『图层窗口』、『历史纪录窗口』、『工具面板』、『选项』面板，可以通过 Window -> Workspace -> New WorkSpaces 保存工作区，以便下次打开。
photoshop-mainWindow.png
视图
在视图菜单下启动辅助视图
- 对齐，会启动靠近吸附功能
- 标尺，Command + R
- 参考线，Command + ;
photoshop-menu.png
切图常用工具
| 工具名 | 示意图 | 注释 |
|---|---|---|
| 移动工具 |  hwa_03.png
|
|
| 矩形选框工具 |  hwa_01.png
|
需将自动选择调至选择图层 |
| 魔棒工具 |  hwa_05.png
|
（容差 Tolerance 越小选择的范围就越小）消除锯齿可以让选择区域光滑 |
| 剪裁工具 |  hwa_06.png
|
|
| 切片工具 |  hwa_07.png
|
在裁剪工具分支下 |
| 缩放工具 |  hwa_34.png
|
Ctrl+加号与Ctrl+减号 或者 alt+鼠标滑轮
|
| 取色器 |  hwa_31.png
|
常用快捷键
放大缩小画布
- 放大到100%大小：Ctrl+数字1
- 放大：ctrl + 加号
- 缩小：ctrl + 减号
- alt + 滚轮
合并图层
- 合并图层：ctrl+E
- 合并可见图层：ctrl+shift+E
所有工具及快捷键如下
ToolsPanelOverview.png
