网页切图的步骤详解

巨优网络网站建设公司（www.juoou.com）介绍一下网页切图的步骤详解，网页切图的过程无非是将网页设计师的作品（psd源文件）通过div+css 的技术 手段将它制作做成网页版的过程，然后在添加程序，制作出一个完整的网页，切图的过程是整个网站建设中最繁琐的一环，也是最需要细心的一个环节。

一，概述

1，网页切图，是指经过切图后输出为Html的页面。

2，网页切图处理，主要是指处理输出后的Html页面，经过Html格式的编辑后，使其能够满足实际要求（可以自由伸缩等等）

3，处理网页切图的工具可以有Frontpage或Dreamweaver，一般来说建议使用Dreamweaver。

二，网页切图处理

1，处理过程一般为：

1）使用Dreamweaver软件打开输出后的html页面。

2）去掉Html中多余的图片（Html格式输出后，切片均变为了图片）

3）将需要随页面大小自动伸缩的部分的图片变为背景，并设置背景以某种方式自动延伸。

4）某些部分可能不要自动伸缩，但需要在这些部分上面显示文字，这时也要将这部分图片变为背景，只是背景不做任何方式的延伸。

5）在前面我说过“块”的概念，这个概念在网页切图处理过程中非常重要。

6）切图软件在将切图以Html格式输出成网页后，该网页的Html代码结构一般不是我们所要的，因为里面有大量的rowspan和colspan结构，这极大限制了网页的自由伸缩。

7）解决办法：将整个页面放在一个table中，其中每个块是一个子table，然后在每个子table里面再细分，甚至会出现子子子table（复杂的页面有这种情况），然后将相应的图片放置到我们做的table结构中。而后在进行上面的第2、3、4步骤。