|
|
一，确定主题
二，做好结构规划（板块）
三，收集素材，（文字、图片、视频，声音等素材）
四，安装好Dreamweaver，软件对网页进行设计制作。本设计使用Dreamweaver cs5软件建立的网站、Photoshop图片处理、flash动画设计辅助完成（利用所学知识对网页进行设计）
制作过程
1、在自已电脑中新建一个文件夹（自定义命名），做为站点如下图，文件夹根目录下再建一个名为一个为images的文件夹，作为默认图像文件夹。
2打开Adobe Dreamweaver ，新建HTML文件，对刚新建的文件夹进行设置。
在标题栏中找到新建站点，新建站点
3、对站点内的默认图像文件夹进行设置
4、在编辑区第一行位置插入表格，一个4行8列的表格
5、第一行高设为高400，合并第一行所有单元格。
6、设置第二行高为50宽为1260，第2行，第2至第6列宽为14%，有格背景颜色设为黑色。
7、设置第三行高为350，宽为1260，合并背景色为#C0AD8B
9、第4行高为90宽1260并合并，填充为黑色
10、在第2行输入，标题名，新建CSS样式，类形：为可应用于任何HTML元素并设置好相应的文字大小类形。
11、插入页眉图片，页眉为图片，或FLASH，大小高为宽高400宽1260，可做成图片形式也可以做成FLASH的格式。
12、设置第三部分正文，为正文填充一个背景颜色，并编辑正文。
13、设置正文样式
设置第页脚，填充背景颜色,填写版权信息
二、文化部份制作流程
1、 在文件面板右键点击，新建文件，新建一个新的LTML命名为WH,复制第一首页代码对中间内容部份进行修改。
复制正文文字对正文的样式进行修改。
在代码页面找至第二段文字后面的图片进行修改，向右对齐。
向右对齐代码align="right"/>
三、美食部份制作
直接复制，复制前面所做的文化页面代码，新建一个新的HTML文件，将其命名为MS，对复制的页面中间内容进行修改。
在正中间对标题进行命名，字体样式根据实际设置大小，（可采用新建CSS样式）
新建一个5行9列的表格
第1列宽73，高250
第2列宽218，高250
第3列宽60，高250
第4列宽218，高250
第5列宽60，高250
第6列宽218，高250
第7列宽60，高250
第8列宽218，高250
第一行高250
第2行高为60
第3行高40
第4行高250
第5行高60
四、景点部份制作
1、复制之前建好的文件，将其改命名为JD，删除正文将正文标题改成景点。
2、 在标题下新建一个6行5列的表格，
3、 第1行高为30
4、 第2行高为220，第一列、第五列宽为10%，第三列，宽126
第三行高为120
第四行高为30
第五行高220
第六行120
四、酒店部份制作
复制之前建好的文件，将其改命名为jiudian，删除正文将正文标题酒店景点。
1、新建2行1列，第一行高267，第二列70
2、插入5列1行表格
3、表格高度为267，第1列，第5列宽为5%，合并2、3、4列
4、在合并单元格中新建1行1列单元格，表格宽度为1134，边框为了1，表格高设为267，在将表格边设为白色
5、 scope="col" bordercolor="#FFFFFF">
6、在表格中插入1行3列的表格，宽为1134，表格高为267，表格第1列宽为400，第2列第3列分别为367
7、插入1行3列表格
2、在第一行插入1行3列表格，第一列高为267，宽为400，第2列宽为440，第3列宽为420，重复以上参数制作第2更列第列表格，（或学习视频中直接复制第一步的代码，将正文图片和内容进行修改）
留言板制作
新建一个8行6列表格
第1、3、5行高50，第2、4、6行高20，第7行高150，第8行高20
第一列宽为250，第2列宽为100，第3列宽为550，
将第7行,第三列与第四第五列合并，插入背景图片
小结
通过广州旅游网站的实例制作主要了解掌握以下几个知识点
1、 站点的建立，设置
2、 掌握页面的布局
3、 掌握表格的合并拆分
4、 掌握表格的创建属性的设置辅助布局
5、 掌握字体样式创建属性的设置
6、 超链接的创建
7、 掌握切片工具的使用
8、 掌握媒体swf文件的插入设置
