网络技术及其应用 实训报告.docx

网络技术及其应用 实训报告.docx

《网络技术及其应用 实训报告.docx》由会员分享，可在线阅读，更多相关《网络技术及其应用 实训报告.docx（15页珍藏版）》请在冰点文库上搜索。

网络技术及其应用实训报告

实训目的：

1、了解DreamweaverMX2004的用户界面

2、掌握网页创建的方法

3、掌握简单网页的制作

4、掌握站点创建方法

5、熟悉站点编辑

6、掌握文档创建多种方法

7、掌握网站设计总规划

8、了解网站建设的基本流程

9、了解站点的整体规划

10、熟悉网页制作的常用操作

11、了解头部内容

12﹑文档创建

创建站点

创建网页

用表格排版网页内容

添加背景音乐

13、了解常用文本的输入方法

14、熟悉文本编辑操作

15、掌握[属性检查器]的设置方法

16、了解网页中常用的图像格式

17、掌握图像属性的设置方法

18、掌握对齐与调整图像

19、掌握创建鼠标经过图像的方法

20、掌握插件属性的设置方法

21、了解Flash的文件类型

22、掌握Flash按钮对象的插入方法

23、理解绝对路径与相对路径。

24﹑理解Dreamweavermx2004中链接的类型。

25﹑掌握页间和页内超链接的创建方法

26、了解表格的视图模式。

27、掌握插入表格的方法。

28﹑掌握编辑表格和单元格的方法。

29﹑掌握表格和单元格属性的设置。

30、创建框架集

31、shezxhi框架和框架集属性

32、分割和删除框架集

实训基本内容：

一﹑DreamweaverMX2004的功能

1完美的操作界面

2强大的模板功能

3创建动态网页

4强大的代码编辑功能

5完备的建站向导和网产管理

二﹑DreamweaverMX2004的用户界面

1DreamweaverMX2004的工作区

2文档编辑窗口

3工具栏﹑状态栏﹑上下文菜单栏

插入工具栏﹑属性检查器﹑面板组

1﹑创建站点

在开始使用Dreamweaver之前，一般应该先建立一个Web站点，才能够进行以后的操作。

在MacromediaDreamweaverMX2004中提供了3类站点，即本地站点、远程站点和测试服务器文件夹。

站点的创建步骤如下：

1选择[站点]/[管理站点]命令，打开[管理站点]对话框。

2在[管理站点]对话框中单击[新建]按钮，选择[站点]选项。

打开[站点定义向导]对话框，设置站点的内容。

2﹑编辑站点

用户使用DreamweaverMX2004能够对现有站点进行编辑，修改等操作。

编辑站点步骤如下：

在Dreamweavermx2004中，用户可以使用[站点]/[管理站点]命令来编辑本地或远程的站点。

4﹑创建文档

Dreamweavermx2004提供多种创建文档的方法，用户可以创建一个新的空白HTML文档，或使用模板创建新文档。

三创建新文档种类：

1创建空白文档

在文档窗口中，选择[文件]/[新建]命令或按下Ctrl+N快捷键，在打开的[新建]/[文档]对话框中选择要创建的文档类型。

2创建基于Dreamweaver设计文件的文档

3创建模板文档

4打开与保存文档

1﹑网站设计总规划

设计网站时最重要的三大部分：

整体风格﹑色彩搭配和创意设计。

1确定网站的整体风格

网站的整体风格就是指站点的整体形象给浏览者的综合感受。

对网站的整体风格设计方面，可以分以下几个步骤：

第一，选择个人主页题材。

个人主页的选材首先要小而精，题材最好是你自己擅长或者喜爱的内容，最后注意选材不要太滥或者目标太高

第二，确定网站特色。

网页色彩的搭配

总结关于网页色彩搭配的技巧。

创意设计

创意设计是最重要的一项，一个与众不同的网站区别在于此。

2﹑网站建设的基本流程

对于初学者来主，我们建议采用以下流程来完成站点创建与发布：

1）策划和设计网站

2）规划站点

3）布局和编排网页

4）填充网页内容

5）建立动态站点

6）测试和发布站点

3﹑站点的整体规划

当用户希望创建一个WEB站点时，首先考虑如休设计和规划站点，以确保它能制作成功。

1）明确目标和用户需求

2）选择目标观众

3）为兼容的浏览器创建站点

4）组织站点结构和创建设计图

5）设计结构简单和导航图

6）设计和收集资源

内容：

页面属性设置

在[属性]面板中的页面属性命令，可以设置背景，颜色，图片，文字大小。

网格，标尺设置

用户可使用[查看]/[标尺]/[显示]命令或[查看]/[网格]/[显示网格]命令，在网页文档中显示标尺和网格。

3﹑查看和编辑头部内容

通常一个HTML文件包含两个主要部分，一是和标记之间的头部，另一个是和标记之间的正文部分。

正文部分是文档的主要部分，包括可见的文本，图形等。

文档的头部元素包括META，[关键字]，[描述]，[刷新]，[基础]和[链接]。

其中，META是HTML头部的主要组成部分，主要用于记录一个文档的页面信息，这些信息可被计算机识别，用于某些特定的场合。

1、输入文本

特殊字符输入

要在文档中输入特定的的字符，最常用的方法是选择[插入]工具栏中[文本]选项卡。

也可以选择[插入]/HTML]/[特殊字符]菜单命令下的相应命令插入相应字符。

在字符之间添加空格

插入不换行空格，可执行如下操作之一。

1）在“插入”栏的“文本”选项卡中，单击“字符”按钮，在下拉列表中选择“插入不换行空格”选项。

2）选择[插入]/[HTML]/特殊字符]/[不换行空格]菜单命令。

3）按【Ctrl+Shift+空格键】键输入。

4）将输入法切换到全角状态再按空格键。

[Enter]与[Shift+Enter]区别

使用键盘[Enter]键对文本分段，即[Enter]键与

标记对应。

使用[Shift+Enter]组合键可以强制文本折行，但仍属于同一段，即[Shift+Enter]组合键与
标记应。

水平线﹑日期

选择[插入]/[HTML]/[水平线]菜单命令。

选择[插入]/[日期]菜单命令。

2﹑编辑文本

设置文本，使用[文本]属性检查器，设置对齐文本，字体，使用上下文菜单等内容，项目列表，无序列表。

四﹑插入与编辑图像

一般用于网页的图像要求是GIF、JPEG或PNG3种格式中的一种。

目前大部分的浏览器都支持GIF和JPEG文件格式，只有MicrosoftInternetExplorer（4.0及更高版本）和NetScapeNavigator（4.0及更高版本）部分支持PNG格式。

GIF（GraphicsInterchangeFormat）意为图形交换格式，扩展名为GIF，它最多支持255种颜色，最适合显示色调不连续或具有大面积单一颜色的图像。

JPEG（JoinPhotographGraphics）意为联合图像专家组标准文件格式，扩展名为JPG或JPEG，是用于摄影或连续色调图像的高级格式。

因为JPEG文件可以包含数百万种颜色。

PNG（可移植网络图形）文件格式：

扩展名PNG，这种格式是一种替代GIF格式的无专利权限限制的格式，它包括对索引色、灰度、真彩色图像以及alpha通道透明的支持。

五、插入图象：

[插入]栏中[常用]选项卡操作：

设置图象的属性：

图象的高宽，源文件，类等属性设置

对齐方式：

左对齐，右对齐，居中对齐。

2﹑插入其他图象元素

插入图像占位符

图象占位符是在准备好将图象添加到网页文档之间而使用的图象。

插入鼠标经过图象

鼠标经过图像由两个图像组成，主图像（首次载入页时显示的图像）和次图像（当鼠标指针移过主图像时显示的图像）。

鼠标经过图像中的两个图像其大小应相等，如果两个图像大小不同，Dreamweaver将自动调整第二个图像的大小以匹配第一个图像的大小。

六、操作如下：

选择[插入]/[图像对象]/[鼠标经过图像]菜单命令。

电子相册创建

前期工作准备：

在Dreamweaver中内置了创建网站相册的命令，但此命令实际是调用了Fireworks的图片处理功能。

所以要首先安装Fireworks软件。

首先创建一个名为“电子相册”的站点，设置本地文件夹为E:

\photo，并在该文件夹下新建两个文件夹，分别取名为Source和Object，然后在Source文件夹中放入收藏的图片。

电子相册创建步骤如下：

选择[命令]/创建网站相册]菜单命令，打开“创建网站相册”对话框。

学生独立动手制作先锋软件图片网页。

1﹑插入音频和视频文件

通过表格布局页面，来添加音乐内容。

1）链接到音频文件

选择你要用作指向音频文件的链接的文本或图像。

在其[属性]面板中，单击文件夹图标以浏览到音频文件，或者在[链接]文本中键入文件的路径和名称。

2）添加音乐（用代码添加）

A．

　　其中，loop="-1"表示音乐无限循环播放，如果你要设置播放次数，则改为相应的数字即可。

B.

“HIDDEN”（控件的隐藏方式，True表示隐藏，Flase表示不隐藏），AUTOSTART（设置自动播放，True表示自动播放，Flase表示不自动播放），LOOP（循环播放，True表示循环播放，Flase表示不循环播放）。

3）用插件添加音乐

A在[插入]栏的[常用]类别中，单击[媒体]按钮，然后选择[插件]图标。

B在[插入]栏的[常用]类别中，单击[媒体]按钮，然后选择[ActiveX]图标。

2﹑添加视频

添加视频文件，要添加插件来。

操作：

选择[插入]/[媒体]/[插件]命令。

3﹑插入Flash对象

Flash动画是一种高质量，高压缩率的矢量动画。

操作：

[插入]/[媒体]/[Flash]按钮。

设置Flash按钮样式，文本，字体，大小，目标，背景色等操作。

七﹑认识URL﹑链接路径

URL（统一资源定位器）指的是Internet文件在网上的地址，它使用数字和字母按一定顺序排列以确定一个地址，由访问方法，服务器，端口号，以及文档位置级成。

链接的路径可以分为三类：

绝对路径，相对路径，根目录路径。

绝对路径（两种形式）

绝对路径指包括服务器协议在内的完全路径，比如：

绝对路径链接方式不利于测试。

相对路径

相对路径就是指由这个文件所在的路径引起的跟其他文件（或文件夹）的路径关系。

基于根目录的路径

所有的路径都是从站点的根目录开始的，首先以一个斜杠开头，代表根目录，然后书写文件夹名，最后书写文件名。

如：

/web/highight/shouey.html

2﹑创建超链接

如果按照使用对象的不同,网页中的链接又可以分为:

文本超链接,图像超链接,E-mail链接,锚点链接,多媒体文件链接,空链接等.

在属性面板中“链接”中“目标”下拉列表框：

-blank：

将链接的文件载入一个未命名的新浏览器窗口中。

-self:

将链接的文件载入该链接所在的同一框架或窗口中，如果不做选择，将默认该选项。

-parent：

将链接的文件载入含有该链接的框架的父框架集或父窗口中。

-top：

在整个浏览器窗口中载入所链接的文件，因而会删除所有框架。

八﹑在页面中使用表格

表格的3种视图模式，分别为[标准]模式﹑[扩展]模式﹑[布局]模式。

表格由一行或多行组成，每行又由一个或多个单元格组成。

表格是多个单元格的集合体。

创建表格的方法如下：

选择[插入]/[表格]菜单命令；

在“插入栏”的“常用”选项卡中单击“表格”按钮；

在“表格“对话框中，设置表格行数，列数，表格宽度，表格粗细，单元格边距和间距等操作。

2﹑嵌套表格

嵌套表格是指在一个表格的单元格中再插入一个表格。

嵌套表格的宽度受所在单元格的宽度的限制。

3﹑编辑表格和单元格

表格创建好后可能不满足的要求，这时就需再对表格进行一些操作，如单元格的合并及拆分、行或列的删除等。

表格编辑和单元格掌握操作如下：

表格和单元格选定

单元格的合并及拆分

插入或删除行或列

表格属性设置

单元格属性设置

九、框架集的制作

1、创建框架集，操作步骤:

选择"修改">"框架集"，然后从子菜单选择拆分项（例如"拆分左框架"或"拆分右框架"）。

Dreamweaver将窗口拆分成几个框架。

如果打开一个现有的文档，它将出现在其中一个框架中。

　　2、将一个框架拆分成几个更小的框架，操作步骤:

要拆分插入点所在的框架，从"修改">"框架集"子菜单选择拆分项。

要以垂直或水平方式拆分一个框架或一组框架，请将框架边框从"设计"视图的边缘拖入"设计"视图的中间。

要使用不在"设计"视图边缘的框架边框拆分一个框架，请在按住Alt键的同时拖动框架边框（Windows）或在按住Option键的同时拖动框架边框（Macintosh）。

要将一个框架拆分成四个框架，请将框架边框从"设计"视图一角拖入框架的中间。

　　提示若要创建三个框架，请首先创建两个框架，然后拆分其中一个框架。

不编辑框架集代码是很难合并两个相邻框架的，所以将四个框架转换成三个框架要比将两个框架转换成三个框架更难。

　3、删除一个框架，操作步骤:

将边框框架拖离页面或拖到父框架的边框上。

　　如果要删除的框架中的文档有未保存的内容，则Dreamweaver将提示您保存该文档。

注意您不能通过拖动边框完全删除一个框架集。

要删除一个框架集，请关闭显示它的"文档"窗口。

如果该框架集文件已保存，则删除该文件。

4、调整框架的大小，操作步骤:

若要设置框架的粗略大小，请在"文档"窗口的"设计"视图中拖动框架边框。

若要指定准确大小，并指定当浏览器窗口大小不允许框架以全大小显示时，浏览器分配给框架的行或列的大小，可使用"属性"检查器。

实训总结：

通过两个星期的实训，我们学到了很多，也认识到自己的不足，网页的设计方面存在很多问题，好多的东西都不会做。

所以说书本上的知识只有应用后才能检验出自己对知识的应用。

所谓实践是检验真理的唯一标准，所以我们应该注重把书本上的知识应用到实践中去，作为一个即将毕业的学生，我们更应该注重实践的重要性，计算机对于现在的社会是非常重要的，在未来的世界要实现计算机办公，也会普及电子商务，所以我们要好好学习计算机，适应时代发展的需要。

电子政务的发展会让我们以后的办公更方便，更省时间。

在实训中，我存在的问题是网页创新以及设计的欠缺，没有自己的创意，也没有自己的想法，所以以后应培养自己的创新能力。

创新是一个民族进步的灵魂，每个人都应该有自己的想法，而不是跟着别人的路走。

其次，是操作的不熟练，好多的功能都找不到，比如滚动以及动画的制作都不知道怎么入手。

现在的这个版本的网页制作程序比较方便，但是我认为仍然存在不足，比如图像的插入程序比较死板，不能准确的键入自己需要的位置。

还有该程序虽然也可以写代码，但是好像有的代码写进去好像也没有发挥它的作用。

最后，我认为我主要的问题是操作的熟练程度以及对书本上的知识的应用不够，要有钻研课本以及实践的兴趣。

兴趣是最好的老师，我们应该培养自己的兴趣，还有充分利用学校的各种网络以及书本资源来实践书本上所学习的，达到真正的应用。