更新对模板的更改

当你在Adobe Photoshop中对你的网页设计模板做了适当的修改后，你应该 更新 这些变化对你的 HTML 文档. 首先，你必须知道一些关于切片在Adobe Photoshop的基础知识. 每一片 PSD文件 表示图像或 background in HTML 文档. 片在 PSD文件 用蓝色矩形标记. 如果你不能看到切片，你应该选择 “视图/显示/片……” 从顶部菜单. 要管理切片，你应该使用工具面板(热键)中的切片工具 “K”). 实际上，这个工具集中有两个切片工具: “切片工具” 和 “选择 切片工具”. 使用 “Shift + K” 热键在这些工具之间切换. 所有合适的切片都已放入 PSD文件 包含在您的网页设计模板包. 所以你只需要选择切片工具. 在使用save for web更新图像之前，你应该确保你想要保存的切片不会与其他切片重叠. 比如大的 background 图像切片可以包含较小的切片按钮图像. 所以在保存这片之前，你应该把它放在上面. 要做到这一点，你应该使用选择切片工具选择这个切片. 然后转到屏幕顶部的选项面板. 如果你因为任何原因看不到这个面板，你应该显示它正在选择 “窗口/选项” 从顶部菜单. 在面板的左侧，您将看到四个切片顺序按钮, 提出, 向后发送和向后发送. 单击“带到前面”按钮将该切片带到前面. 如果你需要的话 更新 小的按钮图像切片在未来，你应该“发送”到“返回”这个大切片，以看到较小的切片.

切片订单按钮

如你所知，有些文本表示为纯文本 HTML，因此在保存包含此类文本的图像之前，您应该隐藏它. 要做到这一点，你应该选择包含该文本的图层. 最简单的方法-是控制点击它，只需点击这个图像 “热” button. 但是如果在这个图像层上存在一些透明层，你就会遇到一些麻烦. 顶部图层将被选中，而不是您的图像图层. 要检查当前选定图层的内容，请执行以下操作. 进入图层面板，选择 “窗口/层” 如果你因为任何原因看不见的话. 在图层列表中找到高亮的图层-这是当前选中的图层. 在图层名称的左边你可以看到 “眼睛” 图标. 点击几次来 “隐藏/显示层” 看看哪个文字在整个画面中消失了. 如果这是你想隐藏的文本-你是一个正确的方式. 如果选择错误，请使用其他方法选择合适图像的图层. 用鼠标右键单击图像. 将显示图层列表. 尝试从列表中选择不同的图层, 请注意，文本层的名称与其内容相同. 使用上面描述的步骤来确保你选择了正确的图层. 如果你选择了需要的类型图层，点击隐藏它 “眼睛” 图层列表中图层名称左侧的图标. 现在是时候了 更新 您的图像使用保存为Web过程. 选择 “文件/保存为Web…” 从顶部菜单或使用 " Ctrl + Alt + Shift + s " 热键. 将出现另存为网页窗口. 在此窗口中，您可以更改图像的优化选项. 实际上，我们的设计师已经为最佳质量/尺寸平衡设置了优化选项. 但是如果你想让你的网站加载更快，你可以降低图像质量. 使用选择切片工具选择切片. 在右侧，您将看到带有图像选项的面板. 您可以更改质量输入框的值 .Jpeg图像或颜色 .GIF和 .PNG图像. 现在选择您想要的切片 更新 用选择切片工具点击它. 如果你想 更新 几片，你应该选择他们持有 “转变” button.

图片的选择

当你选择了所有你想要的切片 更新 点击 “保存” 按钮在保存为网页窗口的右上角. 将出现“另存优化为”窗口. 浏览至 HTML 你的网页设计模板文件夹. 将文件类型选项改为“仅图像”，将切片选项改为“选定切片”. 其他选项可能会损坏原装 HTML 结构.

保存优化窗口

如果一切顺利，你会知道的 弹出 窗口要求更换图像确认. 确认请求.

取代确认

如果这样的窗口没有出现，请确保您保存图像到适当的文件夹. 也检查切片名称通过双击它. 名称和图像类型必须与中的图像相同 HTML 有. 现在是时候检查你所做的修改了. 去 HTML 文件夹的网页设计模板和启动 HTML 文件查看更改. 请注意! 请, 确保你已经观看了这个视频教程，学习如何在Photoshop中使用“带到前面”功能.