页面切割-博卡先锋网站建设|营销型网站|北京网站建设|网页设计|北京网页设

页面切割
发布时间:2009年2月27日阅读次数:691

网站页面设计完成后，接下来要做的就是把设计稿切割成网站制作中用到的小图，常用的工具是PhotoShop。下面以默认的安装界面为例，来看看如何切割页面。

第一步：建立一个文件夹，其中包含两个子文件，一个文件夹(用来存放图片)和一个网页文件（如图1-1）。

图1-1

第二步：在PhotoShop中打开图片，按照需要拉好辅助线。（如图1-2）。

图1-2

第三步：选择工具面板中的矩形选取工具，拖动鼠标选中要裁切的区域。图（1-3）中选择的是网站的LOGO。

图1-3

第四步：执行“图像”→“裁切”，裁切的结果所示。如（图1-4）

图1-4

第五步：在PhotoShop中选择“文件”→“另存为WEB版式”进行输出，在弹出的窗口中可以设置保存文件的类型和其他相关参数，点击“存储”把图片保存到images文件夹中。（如图1-5）

如图1-5

第6步：选择“编辑”→“返回”返回到设计稿页面，接下来重复第3步到第6步，完成页面所有图片的切割。

看着切出的图片是不是迫不及待的要将它们组合成网页，这个放在在下一节中详细介绍。