切片工具
如果您不熟悉导出Web资产或在Photoshop中从画板中导出多个图像,则本教程将帮助您实现这一目标。以下是有关如何从Photoshop导出资源的步骤。我假设您已经具有要导出的多个图像的设计或布局,但不想一个接一个地导出它们。
首先在“工具面板”中选择“切片工具”。切片工具是一次全部导出网站资产的最流行和有用的工具之一。也有切片层,但是对于本快速教程,我们仅关注资产导出。
第2步:切片作品
选择切片工具后,您将必须对要导出和保存的图像或区域进行切片。为此,只需单击并拖动您想变成切片的区域。切片使您可以轻松地在画板上选择区域,无论所选区域是否具有多个图层。它使选择一个区域并将该区域保存为切片变得容易。
现在,您已经对艺术作品进行了切片,现在是时候通过双击每个切片并命名切片来命名切片了。该对话框上的切片名称将是图像文件的名称。
步骤4:保存切片
命名您的片后,你将然后另存为网页通过选择文件>导出>另存为网页(旧)(CC 2015年5月1日)。然后将出现另存为窗口。
步骤5:导出切片
当保存为Web并正确导出文件时,此下一步也是最后一步非常重要。您将使用“ 切片选择工具”来选择切片,然后选择“ PNG图像”选项或您想要另存为的任何文件格式。然后,您将选择底部显示切片的选项,然后从下拉菜单中选择所选切片。
然后,对话框将询问您要将资产保存在何处。“保存为Web”资产将始终保存在名为“ Images”的文件夹中。如果尚未创建一个,则系统将自动为您创建一个。如果您已经创建了一个名为images的文件夹,那么资产将保存在该文件夹中。如果已经创建一个图像,请记住单击并保存在图像文件夹之外。Photoshop会自动进入图像文件夹并将其保存在其中,但是在保存图像资产时,您必须位于图像文件夹之外而不是文件夹内。
,