《网页美工设计Photoshop+Flash+Dreamweaver从入门到精通》——2.3 创建选择区域

简介:

本节书摘来自异步社区《网页美工设计Photoshop+Flash+Dreamweaver从入门到精通》一书中的第2章,第2.3节,作者: 安道通 更多章节内容可以访问云栖社区“异步社区”公众号查看。

2.3 创建选择区域

网页美工设计Photoshop+Flash+Dreamweaver从入门到精通
从图像中选取所需内容是图像处理的基础操作,各种图像的处理往往是基于图像选取、并在所选区域上进行的。如何快速、精确地选取图像十分重要,这就要求掌握好各种选择工具的使用方法。

2.3.1 选框工具
在Photoshop CC中可以使用工具箱中的【矩形选框】工具和【椭圆选框】工具,在图像上选择选区。

使用【矩形选框】工具,在图像上绘制选区的具体操作步骤如下,所使用的文件名如表2-2所示。


662211a57c42b8598eb30fea655907487bf98e05

(1)打开素材文件“原始文件/CH02/选择工具.jpg”,选择工具箱中的“矩形选框”工具,如图2-25所示。

b9691570c0146adab6c35097eab800e246b0f17f

(2)将光标移动到图像,按住鼠标左键进行拖动,释放鼠标后,即可绘制选区,如图2-26所示。


89eb864e0821eafbb140231aa265013785185a4f

(3)在工具箱中选择【椭圆选框】工具,如图2-27所示。


4dabdc962db633b9d60d6d5cac23b2e673f7102a

(4)将光标移动到图像,按住鼠标左键进行拖动,释放鼠标后,即可绘制选区,如图2-28所示。


63c684e419c9aef9938ec6f9cb930ec95689b827

2.3.2 套索工具
使用【套索】工具选取不规则选区的具体操作步骤如下。

(1)打开素材文件“原始文件/CH02/选择工具.jpg”,如图2-29所示。


6dc2884affc27145c548ccaa6c561115ce74044f

(2)选择工具箱中的【磁性套索】工具,如图2-30所示。


98b44eff331f89c265f53cb1d05537635587fc9d

(3)将光标移动到图像上,单击确定选取的起点,然后沿着要选取的物体边缘移动鼠标指针,如图2-31所示。


3fc196eeda56ab640f26a1a78b697063ff63591e

(4)当选取终点回到起点时,鼠标指针右下角会出现一个小圆圈,单击即可选取不规则选区,如图2-32所示。


49362c55231449c3d2a8883b6ca05a340c32b414

2.3.3 魔棒工具
Photoshop的魔棒工具,是一个选区工具,其选择范围的多少取决于其工具选项栏中容差值的高低:容差值高,选择的范围就大,容差值低,选择的范围就小。魔棒工具的快捷键是字母W。如图2-33所示为魔棒工具,魔棒工具选项栏如图2-34所示。


e4f0f785051c901827da78b1447600bf34de2586


f5ec634d498e33179bce86d478ab799de915768d

使用【魔棒】工具选取选区的具体操作步骤如下,所使用的文件名如表2-3所示。


5bbf75cc3e8f1dc0553c43262d40d621d43954e8

(1)打开素材文件“原始文件/CH02/魔棒工具.jpg”,如图2-35所示。

f896a8104a369fcd8423edb6261d4b69fd6992ef

(2)选择工具箱中的【魔棒】工具,如图2-36所示。


3b6cbfff27b6d9ee24ba4864a355dd9e0101f5f2

(3)在图像上单击选择区域,如图2-37所示。


dee03d7e1b6c9c31690db88c0632348ae127b5ff

(4)选择【图层】面板中的背景图层,双击图层弹出【新建图层】对话框,如图2-38所示。


0c7554a64563613ec8cc882819af8c5e8f734af5

(5)单击【确定】按钮,将图层解锁,如图2-39所示。


5e712911139510715c065870b5530a21ed22f38b

(6)按Delete键删除,抠取透明图像,如图2-40所示。


46f419d9c21cc7640fdd3afe0bc958e392795435

(7)选择菜单栏中的【文件】|【存储为Web所用格式】命令,打开【存储为Web所用格式】对话框,在文件格式下拉列表中选择PNG选项,选中【透明度】复选框,如图2-41所示。


c79e59f4e5c4b036d68bbb03a86a52ede0ac6099

(8)单击【存储】按钮,打开【将优化结果存储为】对话框,【格式】选择【仅限图像】,如图2-42所示。单击【保存】按钮,即可将图像输出为背景透明的GIF图像。


f1d6723831e0c7f5477ac2274d0e40a8da170edc
相关文章
|
移动开发 前端开发 JavaScript
Dreamweaver制作网页的步骤
Dreamweaver软件制作网页的步骤
207 0
|
JavaScript
dreamweaver能制作移动网页吗?
dreamweaver能制作移动网页吗?
104 0
Dreamweaver网页色彩的搭配
Dreamweaver网页色彩的搭配
127 0
带你读《Photoshop+Dreamweaver淘宝天猫网店美工与广告设计一本通 : 实战版》之三:商品图像的修复与修饰
本书是一本从网店装修实际需求出发编写的实例型教程,以Photoshop和Dreamweaver为软件环境,详细讲解了它们在网店装修中的应用,帮助读者快速掌握网店图像处理和页面排版的核心技能。本书内容实用,图文并茂,可操作性强,适合网店店长、网店美工等希望快速掌握网店装修和推广技术的读者阅读和学习,也可作为大专院校相关专业或电商培训机构的教学参考书。
|
存储 编解码
带你读《Photoshop+Dreamweaver淘宝天猫网店美工与广告设计一本通 : 实战版》之二:商品图像的快速调整
本书是一本从网店装修实际需求出发编写的实例型教程,以Photoshop和Dreamweaver为软件环境,详细讲解了它们在网店装修中的应用,帮助读者快速掌握网店图像处理和页面排版的核心技能。本书内容实用,图文并茂,可操作性强,适合网店店长、网店美工等希望快速掌握网店装修和推广技术的读者阅读和学习,也可作为大专院校相关专业或电商培训机构的教学参考书。
带你读《Photoshop+Dreamweaver淘宝天猫网店美工与广告设计一本通 : 实战版》之一:写在处理之前
本书是一本从网店装修实际需求出发编写的实例型教程,以Photoshop和Dreamweaver为软件环境,详细讲解了它们在网店装修中的应用,帮助读者快速掌握网店图像处理和页面排版的核心技能。本书内容实用,图文并茂,可操作性强,适合网店店长、网店美工等希望快速掌握网店装修和推广技术的读者阅读和学习,也可作为大专院校相关专业或电商培训机构的教学参考书。
|
Web App开发 前端开发
《网站建设与网页设计从入门到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript》——3.6 实战演练——创建基本文本网页
本节书摘来自异步社区《网站建设与网页设计从入门到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript》一书中的第3章,第3.6节,作者:何新起 更多章节内容可以访问云栖社区“异步社区”公众号查看。
1680 0