![中文版Dreamweaver CC+Flash CC+Photoshop CC网页设计基础培训教程](https://wfqqreader-1252317822.image.myqcloud.com/cover/593/22691593/b_22691593.jpg)
2.4 图像编辑辅助操作
在Photoshop CC中对图像进行编辑或调整等操作时,可以使用相应的辅助工具来帮助我们更好更快地完成图像的编辑,Photoshop CC中所包含的辅助工具有“标尺”“参考线”和“裁剪工具”等。
命令介绍
“屏幕模式”命令:执行该命令中的3个子菜单命令可以切换图像在Photoshop中的显示方式。
“标尺”命令:执行该命令,可以显示或隐藏文档窗口中的标尺,辅助使用者对图像的操作。
“参考线”相关操作:参考线在图像处理过程中起到辅助作用,可以添加、删除、锁定参考线等。
“裁切”命令:执行该命令,可以在弹出的对话框中进行设置从而对图像进行自动裁切操作。
“裁剪工具”:使用该工具可以在图像上单击并拖动鼠标进行自定义裁剪图像操作。
“拉直工具”:在使用“裁剪工具”对图像进行裁剪操作时,才可以使用该工具,通过该工具可以自动校正倾斜的对象。
2.4.1 课堂案例——在Photoshop中查看网页图像
【案例学习目标】学习如何在Photoshop中打开并查看图像。
【案例知识要点】掌握3种不同的屏幕模式及其切换方法,如图2-26所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0032_0003.jpg?sign=1739278411-Fbg1vMy4OIU5qxBTpKvk5VaP6PVKYtDX-0-c61b3efff0319a9ee8d25a244be4bd44)
图2-26
【效果所在位置】光盘\源文件\第2章\素材\24101.jpg。
(1)执行“文件>打开”命令,打开网页图像“光盘\源文件\第2章\素材\24101.jpg”,如图2-27所示。在Photoshop CC中提供了3种不同的屏幕模式,执行“视图>屏幕模式”命令,在其下级菜单中提供了3种屏幕模式可供选择,如图2-28所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0032_0004.jpg?sign=1739278411-oRko9gQYgbD6e0Zo2G99PgCJd01toBKg-0-d3dd8acbcb7d1279e189707aeb3077d4)
图2-27
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0033_0001.jpg?sign=1739278411-xXG9oI78DYa79sS0RkrosCIWVI74QCtp-0-93cb0998cc64ebca460f39f78fc5f3e1)
图2-28
(2)默认情况下,采用“标准屏幕模式”查看网页图像,如图2-29所示。执行“视图>屏幕模式>带有菜单栏的全屏模式”命令,在Photoshop中显示有“菜单”栏和50%灰色背景,无“标题”栏和滚动条的全屏窗口,如图2-30所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0033_0002.jpg?sign=1739278411-icx1swKggv2G0n8W3NH3yIrVVL0sMAvO-0-bcf159f0f246c20c9869d2bf1497da39)
图2-29
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0033_0003.jpg?sign=1739278411-I9J3sCfkSHmTCGI8IZ59tFNK7lyVDtAY-0-248a97c60245282d0178db9a1c07ccac)
图2-30
(3)执行“视图>屏幕模式>全屏模式”命令,显示只有黑色背景,无“标题”栏、“菜单”栏和滚动条的全屏窗口,如图2-31所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0033_0004.jpg?sign=1739278411-VOuliIysGfhOnsxtOfLKC4ByVu0MhUVP-0-94138fe61242f4d3b923994f7a9d86fe)
图2-31
2.4.2 使用标尺和参考线
在Photoshop CC中对图像进行裁剪、定位等操作时,使用标尺工具可以精确地测量图像或者确定图像以及元素的位置,从而得到更加精准的定位。参考线的使用可以有效地帮助用户更加精准、确切地定位图像在进行裁切或缩放操作时的位置。
执行“视图>标尺”命令,或者按快捷键Ctrl+R即可在文档窗口的顶部和左侧显示标尺,如图2-32所示。将光标移至水平标尺上,单击并向下拖动即可拖出一条水平参考线,如图2-33所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0033_0005.jpg?sign=1739278411-SeO5QGJPXF6v7He5gO9nGfsodixoLMmK-0-9307e90d7d1e7db396b16668223371da)
图2-32
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0033_0006.jpg?sign=1739278411-1yHMBLaiJTfDtxbIbqyQojsj0MSm9s3T-0-4d22e8c4d67fa70c9fe08b2435b1d0a2)
图2-33
将光标移至垂直标尺上,单击并向右拖动即可拖出一条垂直参考线,如图2-34所示。使用“移动工具”,将光标移至参考线上,当光标变为状时,单击并拖动即可移动该参考线,如图2-35所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0034_0001.jpg?sign=1739278411-sMfGldHnCZCO6Cn4VqSpfUoaFjByHxQl-0-162e9f8324ca9456ac2756864acb18e6)
图2-34
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0034_0002.jpg?sign=1739278411-AhDVhXj4nFGsCDN1BR1SWagxkndc96RO-0-4fbdc5fff645a3597ca8f65557c7fb5a)
图2-35
如果要删除参考线,将其拖回标尺上即可。如果要删除所有的参考线,可执行“视图>清除参考线”命令。
如果要在精确的点位上创建参考线,可以执行“视图>新建参考线”命令,在弹出的“新建参考线”对话框中对参考线的取向和位置进行设置,如图2-36所示。设置完成后,单击“确定”按钮,即可在精确的位置上创建参考线。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0034_0003.jpg?sign=1739278411-EkDPRQiKR9yYy8UIst89q0xpOEoS9U7t-0-ba407b33e66f213124dca8ce41adb524)
图2-36
2.4.3 课堂案例——校正倾斜图像
【案例学习目标】学习如何校正倾斜的图像。
【案例知识要点】掌握“裁切”命令、“裁剪工具”和“拉直工具”的使用方法,如图2-37所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0034_0004.jpg?sign=1739278411-tImCmjVlX8JHbW14We4uLru9T8KoxdrN-0-1b8e0830501cd4d49927b96e09a55d22)
图2-37
【效果所在位置】光盘\源文件\第2章\校正倾斜图像.jpg。
(1)执行“文件>打开”命令,打开网页图像“光盘\源文件\第2章\素材\24301.jpg”,如图2-38所示。执行“图像>裁切”命令,弹出“裁切”对话框,采用默认设置,如图2-39所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0034_0005.jpg?sign=1739278411-I6g3JhbfUjdIxQXYkkljyT50GIU5rETM-0-d1e26e62026472aa05fa33e3ec9a513f)
图2-38
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0034_0006.jpg?sign=1739278411-F80SnXwdKw1vABafx40FZVcqg73jO8Iw-0-5d9e12d966de75837496bfe70727b76d)
图2-39
(2)单击“确定”按钮,自动将图像四周的白色部分裁切,如图2-40所示。单击工具箱中的“裁剪工具”按钮,在图像中显示裁剪框,如图2-41所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0035_0001.jpg?sign=1739278411-9FpL2TWbrRUCTxkPoLG1Sttr1f7fKRDE-0-5feb2557887f3d47b748c6d5d2377943)
图2-40
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0035_0002.jpg?sign=1739278411-rfth2SoJIGsTnpoDwnB4QIMkRgubmfcq-0-8c8595f6be401c8332358e78bd7ebeb9)
图2-41
(3)单击“选项”栏上的“拉直”按钮,在图像中原来应该水平的位置按住鼠标左键不放,拖动鼠标绘制拉直线,如图2-42所示。释放鼠标左键,Photoshop CC会根据所绘制的拉直线自动计算照片的旋转角度并创建裁剪区域,如图2-43所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0035_0003.jpg?sign=1739278411-Zan4uI92KBklakYvkkOZz5CHD4brCFbA-0-f06e3a2bd041b11b44250bf9bfecf255)
图2-42
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0035_0004.jpg?sign=1739278411-56C1BTO2GPvSd1cPJhQPPIhOzP3rE8MY-0-11973fe371537e1541d58a815ac36e9d)
图2-43
(4)单击“选项”栏上的“提交当前裁剪操作”按钮,或按Enter键,对图像进行裁剪,完成倾斜图像的校正,如图2-44所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0035_0006.jpg?sign=1739278411-00uwfjCFBQqoGxHCIQjyHewbLpandlkl-0-42d7ed925b9da2ce967532fde8ea9017)
图2-44
2.4.4 使用“裁剪工具”
单击工具箱中的“裁剪工具”按钮,在“选项”栏上可以进一步设置各项裁剪属性,如图2-45所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0035_0008.jpg?sign=1739278411-zrQ6c44ccZg4WPD4tX6LmxpgzSD3klP3-0-6ec495f860134e1edbb58f660a624b9a)
图2-45
“预设”下拉列表:在该下拉列表中可以选择预设的裁剪大小,如图2-46所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0035_0013.jpg?sign=1739278411-WLlGK4erEa3i9hLc9Ee1kzPKNkF0gS77-0-35d5460d65116061ed0ab8d01d2fac43)
图2-46
设置裁剪比例:可以在这两个文本框中分别输入裁剪区域的宽度和高度,从而创建一个固定尺寸的裁剪区域。
“清除”按钮:单击该按钮,可以清除所设置的裁剪区域的宽度和高度。
“拉直”按钮:单击该按钮,可以在图像上绘制一条直线,Photoshop CC将自动根据所绘制的直线对图像进行旋转并创建裁剪框。
“设置裁剪工具的叠加选项”按钮:单击该按钮,可在弹出菜单中看到预设的6种裁剪参考线以及裁剪参考线的显示方式,如图2-47所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0036_0001.jpg?sign=1739278411-RyacY8GQiD9cP5VabXEaS7k9uCLp65wu-0-aa794d901f4edbb038a8f450ebf9994c)
图2-47
“设置其他裁切选项”按钮:单击该按钮,弹出其他裁剪选项的设置窗口,如图2-48所示。如果选中“使用经典模式”复选框,则部分选项将不可用,如图2-49所示。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0036_0002.jpg?sign=1739278411-vHnEFOPLNd067bRfHHWtXfZ8PqXNuekv-0-c245923e707ed69b4513d9b6007aba9f)
图2-48
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0036_0003.jpg?sign=1739278411-kPxQavOyOnUHm4yBnDTiqhlhCbW6Euzq-0-29fd651fc2a7a7ee6302ad46a0bc2c25)
图2-49
“删除裁剪的像素”复选项:选中“删除裁剪的像素”复选项,对图像进行裁剪操作后,将删除裁剪区域以外的内容;如果不勾选该复选框,对图像进行裁剪操作后,将隐藏裁剪区域以外的内容,可以通过移动图像来使隐藏区域可见或者重新使用“裁剪工具”,同样可以显示裁剪前的图像。
相关操作按钮:单击“复位裁剪框”按钮,可以复位对裁剪所做的旋转以及宽度和高度的调整。单击“取消当前裁剪操作”按钮
,可以取消当前的裁剪框。单击“提交当前裁剪操作”按钮
,可以按当前裁剪框对图像进行裁剪操作。
2.4.5 使用“裁切”命令
在Photoshop CC中,执行“图像>裁切”命令,弹出“裁切”对话框,如图2-50所示。在该对话框中进行相应的设置,可以去除图像多余的空白边。
![](https://epubservercos.yuewen.com/FDE6BA/11261877603072106/epubprivate/OEBPS/Images/figure_0036_0007.jpg?sign=1739278411-nRmkpPIoo9ggLz3LCS2CsUCRWvrg9N38-0-048d12da38f669cafaa933ddfa9b3e4c)
图2-50
“透明像素”选项:可以删除图像边缘的透明区域,留下包含非透明像素的最小图像。
“左上角像素颜色”选项:从图像中删除左上角像素颜色的区域。
“右下角像素颜色”选项:从图像中删除右下角像素颜色的区域。
裁切:用来设置需要修整的图像区域。