利立德网络创业联盟 >> 网站基础知识 >> photoshop切图过程 图文解析

photoshop切图过程 图文解析

利立德网络创业联盟 中新虚拟主机 home 2007-6-7 23:01:30
如何用ps切割图片文件并输出为网页文件。如何把前期修改好的PSD文件输出为网页。

前期准备,构思网站风格、内容版块,收集相关素材。在Photoshop等图象软件中按照网页的大小和样式制作图片,完成网站主页风格制作。

如图1图片点击可在新窗口打开查看此主题相关图片如下:
图片点击可在新窗口打开查看 
(注:psd是Adobe photoshop位图文件.以保存尚未编辑完的ps作业,便于下次继续编辑,打开此图,ps软件也会打开的,第一次ps打开的当然是jpg,gif等常见图文件)

 1、在photoshop中使用切片选取工具,如图a1图片点击可在新窗口打开查看此主题相关图片如下:
图片点击可在新窗口打开查看 

2、在Photoshop中打开标尺,用标尺对想要划分的区域精确定位 如图a2图片点击可在新窗口打开查看此主题相关图片如下:
图片点击可在新窗口打开查看
(注意:点完标尺后点移动工具,光标放在表格线上方下移划横线,光标放在表格最左边,右移,划竖线,不然你的表格线无法划画,多体会下,画不出?哦呵,能在你身边就好了:))

3、 点切片工具,点ps窗口上的"辐助线建切片", 切割版面为独立部分。如图a3图片点击可在新窗口打开查看此主题相关图片如下:
图片点击可在新窗口打开查看

 4、单击菜单File\save as web命令,如图a4,a5:图片点击可在新窗口打开查看此主题相关图片如下:
图片点击可在新窗口打开查看
图片点击可在新窗口打开查看此主题相关图片如下:
图片点击可在新窗口打开查看

 5、使用dreamwaver或FrontPage打开保存的网页,按照cms系统的教程嵌入调用代码。

责任编辑: 阿飞 参与评论
利立德网络创业联盟 2007版权所有 让我们共同创业! greatafei@126.com qq:279669626 豫ICP备05021003号
Powered By: KingCMS 3.0 Beta