Photoshop网页设计中切片使用教程

12.1.1创建切片

使用切片工具创建切片

1.选择切片工具

。绘制的任何切片都将自动出现在文档窗口中。

2.选取选项栏中的样式设置，如图12-1-7所示：

图12-1-7

正常在我们拖动的同时来确定切片比例。如图12-1-8所示：

图12-1-8

固定长宽比设置高宽比。输入整数或小数作为长宽比。例如，若要创建一个宽度是高度两倍的切片，请输入宽度6和高度3。如图12-1-9所示：

图12-1-9

固定大小指定切片的高度和宽度。输入整数像素值。如图12-1-10所示。

图12-1-10

3.在要创建切片的区域上拖动。按住【Shift】键并拖动可将切片限制为正方形。按住【Alt】键拖动可从中心绘制。

基于参考线创建切片

向图像中添加参考线。选择切片工具，然后在选项栏中单击【基于参考线的切片】。如图12-1-11和12-1-12所示：

图12-1-11

图12-1-12

基于图层的切片

基于图层的切片与图层的像素内容相关联，因此移动切片、组合切片、划分切片、调整切片大小和对齐切片的唯一方法是编辑相应的图层，如图12-1-13所示。除非我们将该切片转换为用户切片。

图12-1-13

将自动切片和基于图层的切片转换为用户切片:

图像中的所有自动切片都链接在一起并共享相同的优化设置。如果要为自动切片设置不同的优化设置，则必须将其提升为用户切片。

1.使用切片选择工具，选择一个或多个要转换的切片。

2.单击选项栏中的【提升】。

12.1.2切片选择工具

【切片选择工具】是在我们使用【切片工具】创建切片后，用来更精确的调整和划分切片用的，我们可以选择某个部分的切片，利用控制句柄来调整它的大小，如图3.20所示，也可以利用选项栏中的【划分】按钮来从一个切片中划分出多个切片，如图3.21所示。我们可以利用键盘中的【K】键来直接选择【切片工具】或【切片选择工具】。

选择切片通过使用切片选择工具对图片进行单击选择，按住【shift】键可选择多个切片。

移动切片选择切片后，按住鼠标左键不放进行移动，如图12-1-14所示：

图12-1-14

调整切片大小对切片大小调整方法有两种，一种通过切片的控制点进行自由调整，另一种通过双击切片，在选项对话框中进行调整。如图12-1-15所示：

图12-1-15

复制切片选择要复制的图片，按住【Alt】键进行移动。

组合切片选择要组合的切片，点击鼠标右键，选择【组合切片】选项。

更改切片的堆栈顺序选择切片，通过选项栏中的堆叠顺序选项进行更改。如图12-1-16所示。

图12-1-16A.置为顶层B.前移一层C.后移一层D.置为底层

对齐切片选择切片，通过选项栏的对齐选项按钮进行对齐。如图12-1-17所示。

图12-1-17

A.顶对齐B.垂直居中对齐C.底对齐D.左对齐E.水平居中对齐F.右对齐

分布切片选择切片，通过选项栏中分布按钮进行分布。如图12-1-18所示。

图12-1-18

A.按顶分布B.垂直居中分布C.按底分布D.按左分布E.水平居中分布F.按右分布

删除切片选择【视图】—【清除切片】进行删除。如想删除某一个切片，可单击鼠标右键选择【删除】。

锁定切片选择【视图】—【锁定切片】。

切片最重要的是区分出网页中哪些是图像区域，哪些是文本区域，并创建图文并茂的网站界面。

未完待续......