如何用DW和FW制作网页(初步入门)教程

2024年1月25日发(作者：)

如何用DW和FW制作网页（初步入门）教程

1.用fw做一个页面的蓝图，大小尺寸及颜色都按照未来页面实际情况来。这样做的好处就是可以加强页面的整体感。

2.用fw的切片工具 注意：1>切图前先大致构思好未来网页的布局、表格、框架等。

切图。

2>图片尽可能的小，对于大面积且有重叠规律的图片，只取其重叠方向的一个像素宽的图片，用来做页面局部背景的图片，这样利用背景的重叠性就可以实现蓝图中的效果并且很大程度上减小了页面的体积。

3>诸多切片的边界尽可能多的处于同一横坐标或纵坐标上。

3.导出切片（鼠标放在切片上右键“导出所选切片”），并命名（简单易记易懂的名字可以使你后来的工作事半功倍）。

图片的格式在文件>>>导出预览面板里设置，按照 gif(128),gif(256),jpg的先后顺序，导出格式首先考虑前面的，在满足不了颜色质量要求的情况下再考虑后面的导出格式。

4.用dw创建新页面。页面的顶间距(top margin)和左间距(left-margin)一般都设为0，但顶间距(top margin)也可以不是0，视你的设计要求而定.

5.按照页面整体的布局，用DW插入表格

居中，一般宽度为775（考虑到800*600像素显示器下无横向滚动条），但也没有定论。这里我选择了230，因为我要做的是BK设计的QQ迷你门户。只考虑宽度，先不用考虑表格高度，因为以后插入的图片和表格会将高度撑起来

6.按照布局的需要可以在整体表格里嵌套表格以达到精确布局。插入图片及背景图片。 插入背景图片的时候要注意控制好背景所属单元格的高度和宽度，因为背景撑不起表格所以需要手工设置td的宽度width和高度height的值

另外两个小技巧： 1〉设置高度小于5像素的单元格td时，DW无法从设计模式下实现。实现的方法：先在属性面板里将高度height的值设置为你要的高度值，接着用鼠标单击该单元格内部，然后将界面切换到代码模式下，此时在闪动的光标附近你将会看到" "的代码，

删掉它，最后切换回设计模式下你发现了什么呢？呵呵~

2〉DW创建的表格如果设置边框bordor的值为1的话，你会发现它并不美观。如何实现美观纤细的细线表格？这个问题是个老问题了，请参考：/

7.这样的话，网页就基本作成了，然后添加进去文字内容及你需要的特效，字体的大小和样式可以在选择上文字之后属性面板里修改

8.大功告成，文件保存为.htm或者其他格式的网页。