文档库
文档库 最新最全的文档下载
当前位置：文档库 › 网页制作教案-

网页制作教案-

网页制作教案-
网页制作教案-

教案首页

第1单元授课时间：1周

《第一章》Dreamweaver网页制作

网页制作基础概述

1．超文本标识语言（HTML）

HTML（Hypertext Markup Language）是一种专门用于Web页制作的编程语言，用来描述超文本各个部分的内容，告诉浏览器如何显示文本，怎样生成与别的文本或图像的链接点。

HTML文档由文本、格式化代码和导向其他文档的超链接组成。

2．FrontPage2000

FrontPage是由Microsoft公司推出的新一代Web网页制作工具。FrontPage使网页制作者能够更加方便、快捷地创建和发布网页，具有直观的网页制作和管理方法，简化了大量工作。

FrontPage界面与Word、PowerPoint等软件的界面极为相似，为使用者带来了极大的方便，Microsoft公司将FrontPage封装入Office之中，成为Office家族的一员，使之功能更为强大。

3．Dreamweaver

Dreamweaver是由Macromedia公司推出的一款在网页制作方面大众化的软件，它具有可视化编辑界面，用户不必编写复杂的HTML源代码就可以生成跨平台、跨浏览器的网页，不仅适合于专业网页编辑人员的需要，同时也容易被业余网友们所掌握。另外，Dreamweaver的网页动态效果与网页排版功能都比一般的软件好用，即使是初学者也能制作出相当于专业水准的网页，所以Dreamweaver是网页设计者的首选工具。

Dreamweaver支持动态HTML，并采用了Roundtrip HTML技术，从而奠定了在网页高级设计功能方面的领先地位。在进行网页设计过程中，动态HTML技术能够让用户轻松设计复杂的交互式网页，产生动态效果；而Roundtrip HTML技术则可以真正支持HTML源编辑模式，不会产生冗余代码，使网页渲染速度加快。因此，Dreamweaver 是一种可以满足多层次需求、功能强大的可视化专业级网页设计及制作工具

二、网页美化工具为了使制作的网页更为美观，用户在利用网页制作工具制作网页时，还需利用网页美化工具对网页进行美化。

1．Photoshop

Photoshop是由Adobe公司开发的图形处理软件，它是目前公认的PC机上最好的通用平面美术设计软件，它功能完善、性能稳定、使用方便，所以在几乎所有的广告、出版、软件公司，Photoshop都是首选的平面制作工具。

2．Fireworks

Fireworks是由Macromedia公司开发的图形处理工具，它的出现使Web作图发生了革命性的变化。因为Fireworks是第一套专门为制作网页图形而设计的软件，同时也是专业的网页图形设计及制作的解决方案。

作为一款为网络设计而开发的图像处理软件，Fireworks还能够自动切割图像、

生成光标动态感应的JavaScript程序等等，而且Fireworks具有强大的动画功能和一个相当完美的网络图像生成器。用户可以从http://www. https://www.wendangku.net/doc/da15014168.html,／站点下载该软件。

3．Flash

Flash是美国Macromedia公司开发的矢量图形编辑和动画创作的专业软件，它是一种交互式动画设计工具，用它可以将音乐、声效、动画以及富有新意的界面融合在一起，以制作出高品质的网页动态效果。它主要应用于网页设计和多媒体创作等领域，功能十分强大和独特，已成为交互式矢量动画的标准，在网上非常流行。Flash广泛应用于网页动画制作、教学动画演示、网上购物、在线游戏等的制作中。

三、网页制作的基本步骤---整体规划

进行网站的整体规划也就是组织网站的内容和设计其结构。网页制作者在明确网页制作的目的及要包括的内容之后，接下来就应该对网站进行规划，以确保文件内容条理清楚、结构合理，这样不仅可以很好地体现设计者的意图，也将使网站可维护性

与可扩展性增强。

①层状结构

层状结构（如图1.8所示）类似于目

录系统的树型结构，由网站文件的主页开

始，依次划分为一级标题、二级标题等等，

逐级细化，直至提供给浏览者具体信息。

②线性结构

线性结构（如图1.9所示）类似于数

据结构中的线性表，用于组织本身的线性

顺序形式存在的信息，可以引导浏览者按

部就班地浏览整个网站文件。这种结构一

般都用在意义是平行的页面上。

通常情况下，网站文件的结构是层状结构和线性结构相结合的。这样可以充分利用两种结构各自的特点，使网站文件既具有条理性、规范性，又可同时满足设计者和浏览者的要求。

教案首页

第2单元授课时间：2周

Dreamweaver工作界面概述及HTML基础

利用Dreamweaver创建站点

1 Dreamweaver简介

1．Dreamweaver的界面

（1）菜单栏（2）工具栏（3）对象面板（4）浮动面板（5）文档窗口

（6）状态栏（7）启动面板（8）属性面板

2．Dreamweaver的视图

作为一种所见即所得的网页编辑软件，Dreamweaver自动在用户创建网页时生成底层的HTML代码，同时提供了很好的HTML代码编辑功能。使用工具栏中的视图切换按钮可以很方便地切换到代码视图，以便查看当前编辑网页的HTML源代码。

2定义站点

1 站点窗口

在Dreamweaver的编辑窗口，选择“Site”|“New Site”菜单，可以打开站点窗口。

站点窗口是Dreamweaver另一

个重要的窗口，左半部是远程站

点的目录，一般显示为空，只有

在FTP连通状态下才有显示内容；

右半部是当前编辑中的本地目

录，有点像windows的资源管理

器。

2．定义站点

方法1：在站点窗口的下拉菜单

选择最后一项“Define Sites”，

弹出“Define Sites”对话框，

点击“New”按钮定义一个新网站。

方法2：在编辑窗口或站点窗口选择命令菜单“Site” | “New Site”选项，弹出“Site Definition for Unnamed Site”对话框，设置结束单击“OK” 按钮。3 站点的基本操作

1．打开站点如果要打开站点，可以在文档窗口或站点窗口中单击“Site”菜单的“Open Site”命令，然后在弹出列表中选择当前已经定义过的站点名称。也可以使用键盘快捷键“F8”，此时将打开最后一次打开的站点窗口。 2．复制站点若要复制当前站点，可以使用文档窗口或站点窗口中“Site”菜单的“Define Site”命令，打开“Define Site”对话框。选中要复制的站点名称，单击“Duplicate”（复制）按钮即可对当前站点进行复制操作。

3．编辑站点

如果要更改当前站点设置，比如对站点进行修改站点名称、设置参数选项等编辑操作，可以使用上面的方法打开“Define Site”对话框，选中一个站点后单击“Edit”按钮，即可打开该站点的定义对话框进行站点编辑。

4．删除站点

在Dreamweaver中删除一个站点非常容易，在弹出的“Define Site”对话框中，单击“Remove”（删除）按钮就可以删除选中的站点。

4利用Dreamweaver处理网页文本

Dreamweaver中对文本的输入及编辑，与Word极其相似。

1．编辑文本

（1）换行

①自动换行：在输入文字时，若某一行的长度超过了Dreamweaver窗口的显示范围，文字将自动换到下一行。

②利用“Enter”键换行：在输入文字后按“Enter”键，文字成段，且上下段之间空一行。

③利用“Shift+Enter”键换行：如果想要将文字手动换行，中间又不能出现空白行，可以按“Shift+Enter”键。

（2）插入特殊的字符

有时为了内容的需要，要在网页中插入一些键盘上没有的特殊字符，在Dreamweaver 中，这些特殊字符不仅可以通过“Insert”菜单下的“Special Character”命令来插入，还可以通过对象面板来直接插入。

2．查找／替换文本的内容

如果要在文档中查找或替找某个文字，可利用Dreamweaver提供的查找和替换功能。选择“Edit”|“Find and Replace”（查找与替换）命令，打开“Find and Replace”对话框，

3．设置文本格式

在Dreamweaver中设置文本格式可以通过属性面板，类似与Microsoft Word中对文本的属性设置，包括段落的格式、字体、字号、字的颜色、字体加粗／倾斜、对齐方式（左对齐／居中／右对齐）、文字所链接的路径或URL等。

五利用HTML处理文本

1 HTML基础

1．标记符标记符又称标签，HTML是影响网页内容显示格式的标记符集合，浏览器根据标记符决定网页的实际显示效果。在HTML中，所有的标记符都用尖括号括起来。例如，表示HTML标记符。绝大多数标记符都是成对出现的，包括开始标记符和结束标记符。如：…<／HTML> .

HTML标记符是不区分大小写的，但通常约定标记符使用大写字母，这有利于HTML文档的维护。

属性是用来描述对象特征的特性。在HTML中，所有的属性都放置在开始标记符的尖括号里，属性与标记符之间用空格分隔，属性的值放在相应属性之后，用等号分

隔，而不同的属性之间用空格分隔。格式为：<标记符属性1=属性值1 属性2=属性值2 …> 受影响的内容 <／标记符>

HTML属性通常也不区分大小写。

2．HTML文档的基本结构

一个典型的HTML文本的基本结构形式如下：

</p><p>文本标题</p><p><／TITLE></p><p><／HEAD></p><p><BODY></p><p>文本内容</p><p><／BODY></p><p><／HTML></p><p>上述文档用到四种标记符，其意义如下：</p><p>（1）HTML标记符 <HTML><／HTML>这两个标记符是HTML文档的标记符。<HTML>处于文档的最前端，表示文档的开始，即浏览器从<HTML>开始解释。而<／HTML>则位于文件的最后一行，这样的结果表示这一整份的文档都是HTML语法的文档。</p><p>（2）HEAD标记符 <HEAD><／HEAD>是HTML文件头标记符，用来描述HTML首部的内容，说明文档的整体信息。所有首部信息并不会出现在利用WWW浏览器所看到的窗体中。<HEAD><／HEAD>通常与某些标记符一起使用，如<TITLE><／TITLE>标记符。（3）TITLE标记符 <TITLE><／TITLE>指的是一份文档的标题。通常来说，每一份文档都应该有一个标题来简述这一份文档的特色或是主题。对于WWW浏览器而言，标题所在的位置虽然依照浏览器的不同而不同，但是大部分都位于浏览器的最上方。（4）BODY标记符 <BODY><／BODY>指的是定义出一个HTML文档的体部，位于首部下面。在<BODY>标记符内的文字，所有使用标记符的地方都可以经浏览器正确地显示在浏览器窗体中。</p><p>2 标题处理在HTML中，用户可以通过Hn标记符来标识文档中的标题和副标题，其中n是1到6的数字。<H1>表示最大的标题，<H6>表示最小的标题。使用标题样式时，必须使用结束标记符。</p><p>标题文字标记符的格式：</p><p><Hn align="对齐方式" > 标题文字 </Hn>属性align用来设置标题在页面中的对齐方式：</p><p>left（左对齐）、center（居中）或right（右对齐）。</p><p>如:</p><p><H4 align="left" face="楷体_GB2312" size="4" color="#0000FF">计算机系</H4></p><!--/p7--><!--p8--><p><Hn>…</Hn>标记符默认显示宋体。<Hn>…</Hn>标记符会自动插入一个空行，不必再用空行标记符。在一个标题行下无法使用不同大小的字体。与HEAD中的<TITLE>…<／TITLE>定义的网页标题不同，标题格式显示在浏览器窗口内，而不显示在浏览器的标题栏中。</p><p>3 段落处理在HTML中段落处理是通过段落标记来完成的，常用的段落标记符有：1．注释标记符</p><p>HTML的注释标记符的格式为：<!--注释内容--></p><p>2．强制换行标记符</p><p>强制换行标记符为<BR>，放在一行的末尾，可以使后面的文字、图片、表格等显示于下一行，而又不会在行与行之间留下空行，即强制文本换行。</p><p>3．强制换段标记符</p><p>在HTML文档中，无法用多个回车、空格、Tab键来调整文档段落的格式。要用HTML的标记符来强制换行、分段。</p><p>（1）强制换段标记符</p><p>强制换段标记符的格式为：</p><p>文字<P></p><p>（2）设置段落标记符</p><p>设置段落标记符的格式为：</p><p><P align="对齐方式"> 文字 <／P></p><p>4．显示预排格式标记符</p><p>当用其他编辑工具编排好了一段文字后，其中很可能有一些HTML文件不支持的控制符号，如同车、多个空格、Tab键等。如果希望在浏览网页时仍保留在编辑工具中已经排好的段落格式，可以使用<PRE>标记符将预先排好的格式保留下来。</p><p>显示预排格式标记符的格式为：</p><p><PRE>预先排好的格式<／PRE></p><p>5．分区显示标记符</p><p>分区显示标记符的格式为：</p><p><DIV align="对齐方式"> 文本或图像 <／DIV ></p><p>6．水平线</p><p>在页面中插入一条水平标尺线（Horizontal Rules），可以使不同功能的文字分隔开，看起来整齐、明了。</p><p>水平线标记符的格式为：</p><p><HR align="对齐方式" size="横线粗细" width="横线长度" color="横线颜色" noshade></p><p>7文本格式处理文本格式处理包括文字设置和格式处理。</p><p>1．文字设置</p><p>在网页中为了增强页面的层次，其中的文字可以用不同的大小、字体、字型和颜色，通常用FONT标记符来完成。</p><!--/p8--><!--p9--><p>FONT标记符设置格式为：</p><p><FONT size="数字" face="字体名" color="颜色"> 被设置的文字 <／FONT> size 属性是字号属性，用于控制文字的大小，它的取值既可以是绝对值，也可以是相对值。 face属性是字体标记符，用来指定字体样式。</p><p>color属性可用来控制文字的颜色，属性值可以是颜色名称或十六进制值。</p><p>2．格式处理</p><p>HTML中的格式标记符有：</p><p><P> <／P></p><p><BR></p><p><BLOCKQUOTE> <／BLOCKQUOTE></p><p><DL> <／DL> <DT> <／DT> <DD> <／DD></p><p><OL> <／OL> <UL> <／UL> <LI><／LI></p><p><DIV> <／DIV></p><p><BLOCKQUOTE><／BLOCKQUOTE>标记符之间加入的文本将会在浏览器中按两边缩进的方式显示出来。</p><p><DL><／DL>标记符是指Directory List，用来创建一个普通的列表，; <DT><／DT>用来创建列表中的上层项目；<DD><／DD>用来创建列表中最下层项目；<DT><／DT>和<DD><／DD>都必须放在<DL><／DL>标志对之间。</p><p><OL><／OL>标记符指Ordered List，它是用来创建一个标有数字的列表；<UL><／UL>标记符用来创建一个标有圆点的列表；<LI><／LI>标记符只能在<OL><／OL>或<UL><／UL>标记符内使用，此标记符用来创建一个列表项。</p><p>3．设置页面属性</p><p>（1）设置页面背景颜色</p><p><BODY>标记符中使用bgcolor属性可以为网页设置背景颜色。</p><p>（2）设置页面背景图像单纯使用一种颜色作为背景显然有些单调，网页设计者也可选择特定图案作为页面的背景，使用BODY标记符的background属性即可。HTML 语句为：</p><p><BODY background=“网页背景图案的地址”></p><p>（3）设置文字和超链接的颜色在设置了背景图案或背景颜色后，常常需要更改正文字符和超链接的颜色，以便与背景相适应。设置正文和超链接颜色时，可以使用BODY标记符的text、link、vlink和alink属性。其中，text属性用于设置正文的颜色；link属性用于设置未被访问的超链接的颜色；vlink用于设置已被访问过的超链接的颜色；alink用于设置活动超链接（即当前选定的超链接）的颜色。</p><!--/p9--><!--p10--><p>教案首页</p><p>第3单元授课时间：3周</p><!--/p10--><!--p11--><p>创建站点、设置网页文本、表格与图像</p><p>利用Dreamweaver编辑图像</p><p>图像与颜色是分不开的。颜色有一个共同点，都是由红、绿、蓝这三种基色调混和而成的，RGB其实就是Red、Green、Blue的缩写。</p><p>在网页中运用色彩一般应遵循下列几个原则。</p><p>（1）一个页面中切忌采用过多的颜色，否则会给人一种繁杂的感觉，也烘托不了网页的主题，选用颜色一般不要超过三四种。（2）背景的颜色不要太深，显得过于厚重，因为这样会影响整个页面的显示效果。但也有例外，黑色的背景衬托出亮丽的文本和图像，会给人一种另类的感觉。（3）要保持整个网页的色调统一。（4）要围绕网页的主题选择颜色，色彩要能烘托出主题。</p><p>1 使用网页图像的要点</p><p>在Web页上显示图片之前，通常需要考虑下列三个问题：</p><p>①确保文件较小；②控制图像的数量和质量；③合理使用动画。</p><p>2 在网页中插入图像</p><p>1．插入图像</p><p>在Dreamweaver中插入图像操作步骤(见课本)。</p><p>2．图像属性参数</p><p>在文档中插入图像后，用鼠标单击图像，图像四周出现可编辑的缩放手柄，说明该图像被选定。这时属性面板中显示出关于图像的属性信息。</p><p>3．改变图像的尺寸</p><p>改变图像的尺寸大小可以通过在属性面板中的“Ｗ”和“Ｈ”直接输入数值来改变图像的尺寸大小。此外，还可以通过拖放图像边框来改变图像的尺寸。</p><p>4．调整图像在网页中的相对位置</p><p>3 设置网页背景</p><p>改变网页背景的状态可以通过两种方法来实现，一种是设置背景颜色；另一种是设置背景图像。</p><p>1．设置网页背景颜色</p><p>设置网页背景色在页面属性对话框里设置。</p><p>2．设置背景图像</p><p>设置网页背景色，只能得到单一颜色的背景。如何能使背景发生更多的变化，这就需要设置网页的背景图像。</p><p>4 在Dreamweaver中巧妙地处理图像</p><p>1．给图像加文字说明</p><p>利用Dreamweaver 中为图像加文字说明的功能，可使网页中的图像在不能被浏览器正常显示时，以说明文字代替，以帮助访问者了解图像的信息。</p><p>2．制作低分辨率图像</p><p>3．为图像添加热点</p><!--/p11--><!--p12--><p>热点即图像上不可见的区域，该区域分配了一个超链接。为图像添加热点就是在图像上划分区域，从而设定图像上制作超链接的范围。</p><p>利用Dreamweaver处理网页表格</p><p>1．创建表格</p><p>（1）创建新表格利用Dreamweaver创建新表格时，首先选中对象面板上“View”栏目下“Standard View”（标准视图）按钮，然后可以通过下列四种方式中的任意一种：</p><p>①将对象面板调整到“Common”类上，单击“Insert Table”（插入表格）按钮。</p><p>②通过主窗口的菜单“Insert”|“Table”命令。</p><p>③使用快捷组合键“Ctrl+Alt+T”。</p><p>④将对象面板调整到“Common”类上，拖动“Insert Table”按钮到主窗口的工作区中。</p><p>（2）选择表格</p><p>选择表格可分为选择整个表格和选择表格中的单元格。</p><p>①如果要选择整个表格，则可进行如下的操作之一：</p><p>将光标置于表格中的某个单元格中，选择“Modify”|“Table”|“Select Table”命令。</p><p>将光标置于表格中的某个单元格中，再按两次组合键“Ctrl+A”。</p><p>将光标置于表格中的某个单元格中，单击鼠标右键，在弹出的快捷菜单中选择“Select Table”命令。</p><p>将光标置于表格的尾部（在表格的同一行，但不在表格之内），向左拖动鼠标。</p><p>单击表格的边线。</p><p>②选择单个单元格的方法有以下几种：</p><p>将光标置于所要选择的单元格中，按一次组合键“Ctrl+A”。</p><p>将光标置于所要选择的单元格中，向右拖动鼠标。</p><p>将光标置于所要选择的单元格中，选择“Edit”|“Select All”命令。</p><p>按住Ctrl键，单击所要选择的单元格，再单击一次则取消对单元格的选择。</p><p>③选择多个单元格的方法有以下几种：</p><p>按住Ctrl键，单击所要选择的所有单元格。</p><p>将光标置于单元格中，拖动鼠标，选择多个单元格。</p><p>如果要选择整行，将光标置于该行的左边缘，当光标变成?图标时单击鼠标左键。 如果要选择整列，将光标置于该列的上边缘，当光标变成è图标时单击鼠标左键。</p><p>④选择的全部单元格的方法有以下几种：</p><p>将光标置于第1个单元格中，并拖动鼠标至最后一个单元格。</p><p>将光标置于第1个单元格中，按住Shift键，再单击最后一个单元格。</p><p>将光标置于第1行的左边缘，当光标变成?图标时，向下拖动鼠标至最后一行。 将光标置于第1列的上边缘，当光标变成è图标时，向右拖动鼠标至最后一列。</p><!--/p12--><!--p13--><p>（3）添加／删除行列</p><p>①在现有的表格中插入单元行，可以选择以下的操作之一：</p><p>将光标移到要插入单元行的下一行，选择“Modify”|“Table”|“Insert Row”命令。</p><p>将光标移到要插入单元行的下一行，按组合键“Ctrl+M”。</p><p>将光标移到要插入单元行的下一行，单击鼠标右键，在弹出的快捷菜单中选择“Table”|“Insert Row”命令。</p><p>②在现有的表格中插入单元列，可以选择以上的操作之一：</p><p>将光标移到在插入单元列的右边一列，选择“Modify”|“Table”|“Insert Column”命令。</p><p>将光标移到要插入单元列的右边一列，按组合键“Ctrl+Shift+A”。</p><p>将光标移到要插入单元列的右边一列，单击鼠标右键，在弹出的快捷菜单中选择“Table”|“Insert Column”命令。</p><p>③如果想在现有的表格中添加多行或多列，首先将光标移到要插r入行或列附近的单元格中，单击鼠标右键，在弹出的下拉菜单中选择“Table”|“Insert Rows or Columns”命令，弹出“Insert Rows or Columns”对话框。在此对话框中进行相关的设置，然后单击“OK”按钮，设置的多列或多行将插入到页面中。</p><p>④删除整行／整列，可以采用下列办法之一：</p><p>先选择欲删除的整行或整列，直接按Del键，即可删除。</p><p>先将光标移到要删除的行或列中，选择“Modify”|“Table”|“Delete Row”或“Delete Column”命令。</p><p>将光标移到要删除的行或列中，单击鼠标右键，在弹出的快捷菜单中选择“Table”|“Delete Row”或“Delete Column”命令。</p><p>2．编辑表格</p><p>（1）设置表格高度</p><p>在创建表格时，可以通过表格对话框来设置表格的宽度，但无法设置表格的高度，如果要设置表格的高度，则必须通过表格属性面板来确定。</p><p>（2）合并／拆分单元格</p><p>对表格中的单元格进行合并／拆分，既可以通过菜单命令来实现，也可以通过单元格属性面板（单击任意单元格，属性面板将会自动切换）上的快捷按钮来完成。（3）设置单元格的宽度及高度</p><p>在单元格属性面板上可以改变单元格默认的宽度和高度。</p><p>3．表格属性的设置</p><p>（1）设置表格的边框颜色</p><p>设置表格的边框颜色时，必须指定表格的边框线的宽度不为0。要为表格的边框指定颜色，首先选择表格，单击属性面板上“Brdr Color”的颜色框，在弹出的调色板中选择颜色，或者是在后面的文本框中直接输入颜色的色码，即可为表格的边框添加颜色。</p><!--/p13--><!--p14--><p>（2）设置表格的背景</p><p>表格的背景与网页背景一样，即可以设定为单一的颜色，也可以用图片作为表格的背景。要将表格背景设为单一的颜色，首先选择整个表格，再单击属性面板上“Bg Color”后面的颜色框，在弹出的调色板中选择颜色，或者是在后面的文本框中直接输入颜色的色码；要将图像设为表格的背景，首先选择整个表格，再在属性面板上的“Bg Image”文本框中输入图像所在的路径，或是单击其后的文件夹图标，在弹出的对话框中选择图像文件。</p><p>4．用表格进行页面布局</p><p>Dreamweaver新增加的网页排版功能，可以很方便的实现网页的排版。</p><p>利用Dreamweaver创建网站</p><p>制作一个简单的商务网站（例如C:\CCTV站点），要求有一个主页（C:\CCTV\index 主页）；子页至少三个（C：\CCTV\ P1或P2或P3子页）,并使主页与子页进行相互“超链接”，在网页页面内，插入表格，输入文字与图片，美化页面使之艺术化等。</p><p>步骤如下：</p><p>1、首先双击桌面Dreamweaver图标，打开进入网页制作界面，即新建站点：单击“站点”莱单→管理站点→高级→选择“新建站点”，输入站点位置名称（例如：站点为CCTV，保存位置为C:\CCTV）→确定。</p><p>2、然后单击“文件”莱单→新建→新建普通空白网页，在编辑界面中，先单击“属性”面板中的“居中对齐”，再单击插入栏中的“插入表格”→选择插入6行×6列、边框粗细为0的表格→确定。并可选中表格→在“属性”面板中为其填充颜色等。此外，输入若干文字（主要内容为：站点名称、站点正文内容简介、导航栏内容、版权介绍等）→并将文档内容选中→在“属性”面板中为其设置字体、大小、颜色、对齐方式等。另可在插入栏内，选择插入图片（静态或动态图片），还可插入flash动画电影。在“插入”菜单中→选择媒体→插件→选择某背景音乐等。在“修改”菜单中→页面属性→选择设定背景颜色或背景图片。美化版面，赋予整个页面的艺术性。最后将其保存为主页（C:\CCTV\index）。</p><p>3、再次单击“文件”莱单，新建一个新的网页，重复第二步操作，并分别排版此网页编辑界面中的文档，插入表格，输入文字，插入图片，设定背景，另可设置层和框架与表单、CSS样式及模板等。并保存为子页（例如：C:\CCTV\ P1子页）。其它子页（例如P2与P3子页）制作方法与之类似。</p><p>4、在站点的主（子）页已创建完毕的基础上，打开主页，“选中某一行文字或图片（例如：选中主页中的P1）→选择工具拦上的“超链接”→设定指向的目标子页（例如：C:\CCTV\ P1）→确定。用类似的方法设置主页与各个子页之间的“超链接”，实现相互跳转页面的功能。另外，也可设置电子邮件链接、空链接与友情链接等。</p><p>5、在所有网页保存完毕后，在界面中直接接“F12”键直接运行浏览网页的创建效果。</p><!--/p14--><!--p15--><p>教案首页</p><p>第4单元授课时间：4周</p><!--/p15--><!--p16--><p>网页布局、层、框架的应用</p><p>1. 建立框架</p><p>Dreamweaver在对象面板“Frames（框架）”类中提供了许多组框架组，使用者点击鼠标就可以创建框架。</p><p>2．编辑框架</p><p>框架创建好以后，就可以对框架进行编辑了。每一个框架里都是一个文档，可以直接添加内容，也可以在框架内打开已经存在的文档。</p><p>3．保存框架</p><p>每一个框架都包含一个文档，因此一个框架集会包含多个文档。在保存文档的时候，不能只简单地保存一个文档，要将整个网页文档都保存下来。</p><p>4．框架属性及框架集属性设置</p><p>使用框架属性面板可以查看和设置框架的属性。</p><p>Dreamweaver处理层</p><p>1. 建立层</p><p>Dreamweaver在对象面板层类中提供了许多层组，使用者点击鼠标就可以创建层。2．编辑层</p><p>框架创建好以后，就可以对层进行编辑了。每一个框架里都是一个文档，可以直接添加内容，也可以在层内打开已经存在的文档。</p><p>3．保存层</p><p>每一个层都包含一个内容，因此一个层集会包含多个文档。在保存文档的时候，不能只简单地保存一个文档，要将整个网页文档都保存下来。</p><p>4．容属性及属性设置</p><p>使用属性面板可以查看和设置框架的属性。</p><!--/p16--><!--p17--><p>教案首页</p><p>第5单元授课时间：5周</p><!--/p17--><!--p18--><p>网页编辑与各类超级链接</p><p>1 创建文字超链接</p><p>（1）什么是超链接</p><p>超链接是WWW技术的核心，是网页中最重要、最根本的元素之一。超链接能够使多个孤立的网页之间产生一定的相互联系，从而使单独的网页形成一个有机的整体。</p><p>所谓的超链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片、一个电子邮件地址、一个文件，甚至是一个应用程序。而在一个网页中用来超链接的对象，可以是一段文本或者是一个图片。当浏览者单击已经链接的文字或图片后，链接目标将显示在浏览器上，并且根据目标的类型来打开或运行。</p><p>按照链接路径的不同，网页中超链接一般分为以下3种类型：内部链接、锚点链接和外部链接。</p><p>如果按照使用对象的不同，网页中的链接又可以分为：文本超链接、图像超链接、E-mail链接、锚点链接、多媒体文件链接、空链接等。</p><p>（2）建立文本超链接</p><p>在创建超链接之前，首先了解网站中3种类型的文档路径：绝对路径、和根目录相对路径以及和文档相对路径。</p><p>绝对路径：是包含服务器协议（对于网页来说通常是http://或ftp://）的完全路径，绝对路径包含的是精确地址而不用考虑源文件的位置。但是如果目标文件被移动，则链接无效。创建外部超链接时必须使用绝对路径。</p><p>和根目录相对的路径：是从当前站点的根目录开始的路径。站点上所有可公开的文件都存放在站点的根目录下。和根目录相对的路径使用斜杠以告诉服务器从根目录开始。</p><p>和文档相对的路径：是指和当前文档所在的文件夹相对的路径。这种路径通常是最简单的路径，可以用来链接和当前文档处于同一文件夹下的文档。</p><p>（1）创建文本超链接</p><p>①在网页上选择需要添加超链接的文本，此时属性面板成为文本属性面板；</p><p>②在属性面板上指定文字的链接目标。可按以下4种方法指定文字的超链接：</p><p>单击“Link”文本框右侧的文件夹按钮，在弹出的“选择文件”对话框中选择链接的目标文件。</p><p>在文本框中直接输入目标的绝对路径。</p><p>利用属性面板上的“Point to File（指向文件）”按钮，为文字加入超链接。但必须要建立本地站点，且本地站点上还要有文件存在，才能使用此方法。</p><p>选择“Modify”|“Make Link”命令，也可打开“选择文件”对话框。</p><p>③确定完链接目标之后，在“Link”文本框中出现文字的链接目标。在“Target”下拉列表框中选择目标文件打开的方式</p><!--/p18--><!--p19--><p>Target表示所链接的目标文件在浏览器中打开的方式，在其下拉列表框中一共有4个选项：</p><p>blank：将目标文件载入到新的未命名浏览器窗口中。</p><p>parent：将目标文件载入到父框架集或包含该链接的框架窗口中。</p><p>self：将目标文件载入与该链接相同的框架或窗口中。</p><p>top：将目标文件载入到整个浏览器窗口并删除所有框架。</p><p>_parent、_self、_top只有在使用框架页面时才有效。</p><p>设置结束后，在网页中被选择的文字颜色变为蓝色，且在文字底部出现一条下划线，即文字的超链接设置完成。</p><p>（2）编辑文本超链接</p><p>①设置文本链接的状态</p><p>一个未被访问过的链接与一个被激活的链接在形式上肯定会有所区别，链接被访问过了也会发生变化，提示用户这是一个已经点击过的链接，所有这些都是链接的状态。通过设置不同的文本颜色可以使各个状态区别开来。</p><p>设置不同的文本颜色的具体步骤如下：</p><p>打开包含文本链接的文档“园丁乐园”，选择主菜单中的“Modify（修改）”|“Page Properties（页面属性）”命令，打开“Page Properties（页面属性）”对话框；</p><p>单击“Links（链接）”项右边的图标，打开调色板，选取一种颜色；</p><p>同样为“Visited Links（访问过的链接）”、“Active（活动链接）”项设置不同的颜色；</p><p>单击“Ok”按钮，完成设置。</p><p>设置完成之后，按下“F12”键，预览网页，链接的三种状态通过不同的颜色区别开来。</p><p>②删除文本超链接</p><p>在Dreamweaver中要删除一个文本超链接很容易，先用鼠标选定文本对象，将光标定位于属性面板的“Link”文本框中，用“BackSpace”键或“Delete”键，将其显示的超链接对象文件名删除，再回车，或选择“Modify”|“Remove Link”命令，都可以删除超链接而保留原文本对象。</p><p>2 创建图片超链接</p><p>1．创建图片超链接</p><p>创建图片超链接的步骤如下：</p><p>（1）选中所需建立超链接的图片，此时属性面板为图片的属性面板。</p><p>（2）在图片属性面板中，为图片添加文档相对路径的链接。具体方法可参考为文本添加超链接的操作；</p><p>（3）按“F12”预览网页。</p><p>图像连接不像文本链接那样，会发生许多提示，图像本身不会发生改变，只是</p><!--/p19--><!--p20--><p>在预览网页时，当鼠标指针经过带链接的图像时，指针的形状变为“手”的形状。点击图像就会打开所链接的文档。</p><p>3 创建电子邮件超链接</p><p>如果希望浏览者给你发E-mail时，只要浏览者单击E-mail链接时，就会在浏览端自动打开浏览器默认的E-mail处理程序，收件人的地址将会被E-mail超链接中的指定地址自动装入，无需浏览者输入，就需要创建电子邮件链接。</p><p>创建电子邮件链接如下：</p><p>将光标置于网页中要添加E-mail链接的地方，或选中文字，通过对象面板“Common”类上的“Insert Email Link”按钮，弹出“Insert Email Link”对话框。如果未选中文字，可以在“Text”文本框中添加所需文字；如果已经选中超链接文字，将会在“Text”文本框中自动显示。然后在“E-mail”文本框中输入你的E-mail地址，单击“OK”按钮，就可以了。</p><p>4 创建下载文件超链接</p><p>如果想让网站提供文件下载的功能，就必须建立下载文件超链接。实现文件下载的功能很简单，只需加入连接到文件的超链接就可以了。首先选择主窗口的菜单“Site”|“Site file”命令，打开站点窗口，找到需要链接的目标文件。然后选择网页中需建立超链接的文字，按下“Shift”键拖动鼠标到站点窗口中的目标文件。</p><p>5创建空链接</p><p>空链接是一个未指定目标的链接，Dreamweaver的行为面板中列出了许多行为，这些行为相当于使用JavaScript编写的程序或函数，要想对文本设置行为，首先为文本建立空链接，这样行为才有效。</p><p>为文本建立超链接时，只要先在文档窗口选定文本，然后在属性面板中的“链接”栏中输入一个数值符“#”即可。建立空链接的目的就是为了应用行为，其他情况下不必建立空链接。</p><!--/p20--><!--rset--><h2>《网页制作教学设计》教案</h2><p>《网页制作》教学设计 法、说学法、说教学过程、说板书设计。 一、说教材： (一)教材分析：本节内容是省编《信息技术》全一册第六章 网络与INTERNET基础知识第五节的内容(2000年版为第八章第四节内容，2001、2002版教材第六章第五节内容)。虽然在这一节内容在新版教材变更为拓展模块，但针对现在网络快速发展，广大的学生接触，使用INTERNET的机会也大大增加，学生在使用网络获取信息时，更多的是通过浏览网页这一方式，我认为上好这节课是非常必要的，这对学生进一步认识、使用INTERNET更有益处，同时通过网页制作这一过程也利于学生对计算机常用素材的类型有更深入的了解，在一定程度上也起着培养学生运用综合知识能力作用，所以我认为这节课是非常值得我们去研究上好的，考虑这节课的内容及教法、学法的需要，我把这节分为两课时，第一时：学生自学，自练Word制作网页的基本方法；第二课：让学生自己构思创意一个内容丰富，页面美观的网页。 (二)教学目标：根据对教材的分析及学生实际情况，制定如 下的教学目标： (1)知识目标：1、有关网页文件的说明 2、熟悉用Word制作网页的基本方法 3、超级链接是网页实现互相链接的基本方法 (2)能力目标：1、培养学生的自学能力 2、创意构思能力 3、能制作出具有多重链接、多种素材、内容 丰富的网页。 (3)情感目标：1、教育学生正确认识和理解信息技术相关文 化，伦理和社会问题，负责地使用信息技术。 (三)教学的重、难点：根据对教材的分析及网页制作过程中的 实际情况，我认为要出制作内容丰富的网页，关键是要知 道网页间互相链接的方法，所以我把超级链接做为本节的</p><h2>网页制作试题</h2><p>《网页设计与制作》练兵题 1、在Dreamweaver中，基于______来设计网页时，可把浏览器窗口分割成多个区域，并在每个区域中显示出不同的网页内容。 A、热点技术 B、框架技术 C、表格技术 D、模板技术 2、在Dreamweaver中定义表格时，______指的是单元格内容与单元格左、右边界所持的距离。 A、宽度 B、间距 C、框线粗细 D、边距 3、基于网页创建模板时，可以通过执行______菜单操作来把网页保存为模板。 A、"文件"->"保存为模板" B、"文件"->"另存为模板" C、"文件"->"导出为模板" D、"文件"->"转换为模板" 4、当表格与其所包含的行的格式设置冲突时，______。 A、其它答案均不正确 B、表格的格式设置与行的格式设置哪个优化，视乎其设置的先后顺序 C、行的格式优先于表格的格式设置 D、表格的格式设置优先于行的格式设置 5、在Dreamweaver中，可以通过单击标签选择器中的______来选取表格中的单元格。 A、<td>标签 B、<tr>标签 C、<table>标签 D、<body>标签 6、在Dreamweaver中，可以通过在______中的相应框中输入值并指定其度量单位来设置所选取表格的高度。 A、标准工具栏 B、文件面板 C、标签选择器 D、属性面板 7、在创建一个Dreamweaver模板时，必须在该模板中加入一个______，以便在把该模板套用到某个网页后，网页能被正常使用。 A、可套用区域 B、可控制区域 C、可复制区域 D、可编辑区域 8、在Dreamweaver中，可以基本模板来创建网页。一个模板文档采用______作为其文件扩展名 A、.htm B、.htt C、.dwm D、.dwt 9、在Dreamweaver中，当把表格的宽度度量单位设置为______，该表格便会随着浏览器窗口的大小变化而自动调整其宽度。 A、像素 B、百分比 C、厘米 D、磅 10、在Dreamweaver的文件面板中不能进行管理的功能是______。 A、新建网页 B、删除文件 C、CSS样式的建立 D、更改文件名 11、"文档"窗口用于显示当前文档。下列哪些不是dreamweave的文档视图。 A、"程序"视图 B、"设计"视图 C、"代码"视图 D、"拆分"视图 12、URL的中文全称是__________。 A、统一资源定位符 B、文件传输协议 C、电子公告板 D、超文本传输协议 13、在Dreamweaver属性面板中，哪个框进行提示文字说明的输入。 A、链接输入框 B、目标框 C、源文件框 D、替换框 14、哪些不是HTML文档的基本属性。 A、文本 B、页面标题 C、背景图像 D、表格 15、超级链接属性面板中的目标选项默认的情况下域中总有四个选项，其中_____________选项将连接页面显示在当前框架中。</p><h2>网页制作技术(试题库)</h2><p>9105__网页制作技术(试题库) 9105 网页制作技术(三剑客) 1.假设舞台上有同一个元件的两个实例,如果将其中一个的颜色改为#FF000,大小改为原来的200%,那么另外一个实例将会发生什么变化? A:颜色也变为#FF000,但大小不变 B:大小也变为原来的200%,但颜色不变 C:颜色变为#FF000,大小变为原来的200% D:没有变化 正确答案D 2.Dreamweaver将选定文本变为斜体的快捷操作是? A:Ctrl+B B:Ctrl+I C:Ctrl+Shift+E D:Ctrl+F2 正确答案B 3.使用【修改】|【取消组合】快捷键什么为命令可以对象间的群组关系,使对象分离为群组前的各个对象? A:Ctrl+ Shift + B B:Ctrl+ Shift + Q C:Ctrl+ Shift+ G</p><p>D:Ctrl+ Shift +T 正确答案C 4.菜单栏上的【修改】|【组合】快捷键为什么,命令对多个矢量对象进行群组,群组后变成一个对象? A:Ctrl + B B:Ctrl + Q C:Ctrl + G D:Ctrl + O 正确答案C 5.Timeline表示? A:层 B:行为 C:样式表 D:时间线 正确答案D 6.Flash action“Stop All Sounds”意义是什么? A:停止所有声音的播放 B:跳转至某个超级连接地址URL C:发送FSCommand命令 D:装载影片 正确答案A 7.当Flash导出较短小的事件声音(例如按钮单击的声音)时,最适合的压缩</p><p>选项是什么? A:ADPCM压缩选项 B:MP3压缩选项 C:语音压缩选项 D:原始压缩选项 正确答案A (帮助中可找到) 8.在图层面板下创建蒙板的按钮,单击即可为当前图层创建一个蒙板,直接点击产生的蒙板为白色,按住什么点击产生蒙板,其颜色为黑色? A:Ctrl B:Alt C:Ctrl + Alt D:Shift 正确答案A 9.Bevel效果的作用是什么? A:获得凸起的倒角 B:获得凹陷的倒角 C:可以获得发光的外观 D:A和C都正确 正确答案D 10.图形用来描述图像的是? A:直线 B:曲线</p><h2>Dreamweaver网页制作教案</h2><p>认识Dreamweaver 一、学习目的 了解Dreamweaver，学会利用Dreamweaver制作网页。 二、学习内容 Dreamweaver的基本知识。 【学习步骤】 1、 Dreamweaver的功能 Dreamweaver可以像普通的字处理软件一样编辑Internet上以HTML格式保存的所有文件， 也就是网页；它支持动态HTML，可以在网页中产生动画；还可以在网页中插入各种插件，以产生特殊效果。 Dreamweaver可用于管理站点，它像文件夹一样创建和打开站点，用不同的方式查看站点中各个网页之间的关系，调整站点的组织结构，使整个站点条理清晰。 2、 Dreamweaver的窗口 （1）标题栏 （2）菜单栏 （3）工具栏 （4）视图栏 （5）文件夹列表 （6）工作区 3.网页工作区的三个视图方式选项 它们分别是“普通”、“HTML”“预览”，它们之间的相互切换十分容易实现的。 普通视图方式是Dreamweaver对网页所见即所得编辑方式的最佳体现，在此方式下，可以 像在Word中那样直接进行各种编辑操作，实现网页编辑的所有功能。</p><p>HTML视图实际上是一个文本编辑器，其中给出了普通视图方式下所件网页的HTML代码。在这里可以用菜单命令进行复制、粘贴、删除、查找等操作。对于HTML语言中的不同成分均用不同的颜色显示，这样比较容易区分各种语法成分。 为了在制作网页过程中能够随时查看网页的实际效果，Dreamweaver提供了预览视图方式。 4.安装dreameaver的方法 安装及注册 5.关闭dreameaver 6.保存网页的方法 三、小结 Dreamweaver的基本知识</p><h2>网页制作技术形成性考核第一次作业教学内容</h2><p>保定电大高职高专2008---2009年度第一学期 网页制作技术 形成性考核作业 姓名 学号 年级 专业</p><p>网页制作技术形成性考核第一次作业 成绩 一、填空题 1．在Firewoks MX中，除了可以改变画布的大小外，还可以改变画布的________。 2．在Firewoks MX中，有三种文本变形工具，即缩放工具、倾斜工具和_______________。3．新建的Firewoks文档，默认情况下包含____________和层1两个层，根据需要还可以增加其他的层。 4．如果要在Firewoks文档中的所有帧中都包含相同的对象，可以将对象所在的层设置为_____________。 5．蒙板可以________或隐藏对象的某些部分。 6．蒙板组的创建方法有使用“组合为蒙板”命令和使用___________________命令两种方法。7．制作动画时，食用洋葱皮技术的目的是通过半透明的效果__________其他帧中的内容。8．Firewoks中的帧概念是指__________静态的画面。 9．用Firewoks制作的动画在网页中浏览时，可以播放一次也可以播放多次，如果要动画在网页中持续不断循环播放，应在制作动画时将其设置为__________。 10．在Firewoks中，创建切片的方法有使用工具面板中的切片工具和使用___________________在图像中创建切片。 11．在Firewoks中，创建按钮主要是通过_________________完成，通过绘制不同状态下的按钮图像，完成整钮的创建。 12．在Fireworks中创建弹出适菜单时，应选择一个热点或_______________作为弹出菜单的触发区域,而不能选择一个普通的图像。 13．在文档窗口中，用拖动弹出式菜单边框位置可以设置其相对于触发对象位置，用这种方法只能确定_______________的位置。 14．在Fireworks中, 若要导出单个图像，保存类型选择“仅图像”；若要导出切片图像，保存类型选择__________________。 15．在Fireworks MX中可以使用多种方法制作动画，主要的制作方法有：、补间法制作动画和等。 二、不定项选择题 1．Fireworks MX是一个_______应用软件。 A、网页制作 B、动画编辑 C、图像处理 D、文本处理</p><h2>网页制作公开课教案.doc</h2><p>教学科目授课日期节次教学内容 教学目标 教学重点与难点教学方法 教学资源 公开课教案 网页制作授课班级10 计 4授课教师徐彬2011．06． 12课型任务驱动授课学时 1 课时下午第二节授课地点图书馆动漫机房 有趣的拼图 通过讲解、演示、实践，让学生掌握在网页中运用层制作拼图游戏。 知识目标技能目标态度目标 通过讲解让学生 1. 提高学生分析问题、解决问1、培养学生的观察能力及掌握在网页制作中题的能力勇于探索、勇于创新的精层的特点，学会添加2．锻炼学生的表达能力和协神 “拖动层”行为。并作、沟通能力2、培养学生的团队精神且了解相应的事件。3．提高学生的动手实践能力， 能运用层制作有趣的拼图 教学重点：层的特点、“拖动层”行为。 教学难点：“拖动层”行为。 综合（讲授、启发、引导、演示示范、观察、比较、实践等） 多媒体计算机、多媒体教学软件 本节是《网址制作 DreamweaverMX2004》中层的应用中的内容，是操作实践课。 本节采用情景导学与任务驱动相结合的教学法帮助学生消化吸收新知识， 教学 引起学生的学习兴趣，激起学生的求知欲望，发挥学生的主体作用，体现教师设计 的主导作用。通过兴趣与任务使学生学习到相关的计算机基础知识和操作技 能，进而培养学生的自学能力与动手实践能力。</p><p>教学过程设计 教学环节与主要内容具体教 学目标 教学活动 【复习导入】 ( 一 ) 导入（学时分配： 2 min ） 创设情境，打开“趣味拼图”网页，请 同学玩一玩拼图游戏。 ( 二 )复习知识点（学时分配： 2 min ）1、你觉得我们玩的拼图游戏有什么特点？ 这种特点是利用了什么技术实现的？2、拼图游戏利用了层的什么特点？1、激发学生学习兴 趣。 2、导入新课 教师：帮助学生回顾复习 层的特点。 学生：回顾并实践复习已 学知识 教师：根据实例，提问诱 导，导入课堂任务 学生：观察、讨论、思考 ( 三 ) 明确学习目标（学时分配：1min） 1、层的特点。 2、“拖动层”行为。教师：明确学习目标 3、 onLoad 事件。 【任务分析与制作】 （一）任务初分析（学时分配： 5min）让学生理解理解掌教师：讲解、示范、演示打开趣味拼图网页，引导学生分析制作此网握层的特点。学生：观看操作演示、学页所需的技术：习领会 1、网页布局：表格。 2、图片素材的添加：插入图片（拓展）。通过练习巩固所学学生：实践，完成练习 3、拼图图片的移动：表格转换为层。知识内容。 教师：巡视、评价、辅导（二）任务初制作（学时分配： 15min） 学生制作趣味拼图网页并调试。 （三）任务再分析（学时分配： 5min ）让学生理解理解掌教师：讲解、演示、示范请同学们汇报自己作品的调试成果。握“拖动层”行为以学生：观察、学习、领会针对调试作品所发现的问题进行再分析。及事件的用法。 1. “拖动层”行为。 2. 事件。</p><h2>网页设计与制作压轴模拟试卷一【每日一练】</h2><p>网页设计模拟试题 一、填空题（在空格内填写正确的答案，每空1分，共20分） 1．在Dreamweaver MX中，通过（）可以检查各页面元素的参数设置，也可以针对其中各个参数进行修改。 2．在表格的属性中，（）属性用来设定表格边框的粗细，单元格跨行通过（）属性来实现，单元格跨列通过（）属性来实现。 3．在HTML文档中，以插件方式播放音乐使用（）标签，用（）属性指定音乐的源文件。 4．CSS样式可以定义文字链接的外观，其中（）状态定义了文字链接处于激活状态的显示效果。 5．IE浏览器支持两种客户端脚本语言，它们是（）和（）。 6．JavaScript中的对象由（）和（）两个基本元素构成。 7．在JavaScript中，document对象的（）方法用于向document对象所对应的HTML文档页面写入内容,（）属性为document对象所对应的HTML文档定义标题。 8．在定义行为时，如果希望当鼠标移入页面元素上方时触发事件，则该事件为（）事件。 9．在ASP的内嵌对象中，（）对象主要用于把服务器端的信息发送到浏览器。 10．使用表单提交数据时使用两种方法，分别是（）和（）。 11．在Recordset对象的常用属性和方法中，关闭当前Recordset对象的方法是（）。 12．同HTML一样，XML也是由（）组成的ASCII码文件，其扩展名为（）。 二、单项选择题（将一个正确的答案代码填入括号中，每小题2分，共30分） 1．制作无序号号列表，需使用（）标签。 A、和</p><p>B、<ul>、</ul>和<li> C、<dl>、</dl>和<li> D、<ol>、</ol>和<li> 2．良好的网站目录结构有利于（）。 A、用户浏览 B、页面的布局设计 C、网站的开发与维护 D、网站的CI形象 3．在Dreamweaver MX中创建Recordset对象是通过（）完成的。 A、行为面板 B、服务器行为面板 C、属性检查器 D、CSS样式面板 4．要在页面上创建一个指向中央广播电视大学网站的链接，在属性检查器的链接栏中应该输入（）。 A、# B、mailto: C、 D、 5．如果点击网页中某个链接后在新的浏览器窗口中载入所链接的文档，则应当设置链接的target属性值为（）。 A、_parent B、_self</p><h2>网页制作教案</h2><p>课堂任务快速建站技术—模板的应用 课程名称：利用模板快速建站 课时数：4 教学目标： 知识与技能：了解模板的定义，模板的可编辑区域的定义。 过程与方法：掌握在网页中创建模板的三种方法； 掌握模板的可编辑区域的定义、建立和取消； 掌握模板的应用和取消； 掌握如何将模板从网页中分离出来； 掌握使用模板快速建站； 情感与价值观：培养学生主动思考问题的习惯和自主学习的能力。 教学重点： 在DreamWeaver8中创建模板和应用模板。 教学难点： 学会模板的可编辑区域的定义、建立和取消。 教法： 任务驱动法 学法： 记录关键步骤，积极动手练习。 课前准备： 第三章第三节素材和实例，视频教程：快速建站技术－模板的应用.WMV，快速建站技术－模板的应用(快速更新).WMV。 教学过程设计： （一）导入设计： 我们制作一个网站时，会发现许多网页的版面和元素都是相同的，在设计一个新页面时，我们还可以用复制原来做过页面来减轻工作量。但是如果一个网站有几十、上百张页面都基本相同，这时修改或更新网页的共同元素如网站标志时，会发现工作量实在太大！而使用Dreamweaver 软件中的模板功能来创建新网页，可以大大提高更新和修改的工作效率，网站的维护工作会轻松很多。本节主要内容如下。（二）新课讲解设计： （1）请学生带着以下问题阅读P110～115知识预读，问题如下： A、模板的定义？ B、模板创建的三种方式？了解资源面板的使用方式。 C、学会模板的可编辑区域的定义、建立和取消； D、学会模板的应用和取消； E、学会如何将模板从网页中分离出来； （2）教师提问，请学生一一回答以上问题。期间对回答问题的同学要多多表扬，如“你真棒”。增强学生对教师的亲和力。 （3）教师在学生回答问题的同时，总结评价并补充相关要点。 （4）教师展示完成后的模板网站作品，与学生共同讨论分析该网站制作过程。 （5）教师演示建立模板,创建可编辑区域,应用模板等部分操作（详见教材任务一）。</p><h2>网页制作模拟试卷一</h2><p>北京语言大学网络教育学院 《网页制作》模拟试卷一 注意： 1.试卷保密，考生不得将试卷带出考场或撕页，否则成绩作废。请监考老师负责监督。 2.请各位考生注意考试纪律，考试作弊全部成绩以零分计算。 3.本试卷满分100分，答题时间为90分钟。 4.本试卷分为试题卷和答题卷，所有答案必须答在答题卷上，答在试题卷上不给分。 一、【多项选择题】(本大题共6小题，每小题3分，共18分)在每小题列出的四个选项中有二至四个选项是符合题目要求的，请将正确选项前的字母填在答题卷相应题号处。多选、少选、错选均无分。 1、图像可以分成以下类型（ AB）。 [A] 位图[B] 矢量图形 [C] 影像[D] 图片 2、视频可以分成以下类型（ CD ）。 [A] 录像[B] 电影 [C] 模拟视频[D] 数字视频 3、计算机动画的基本类型（ ABCD ）。 [A] 基于角色的动画[B] 基于帧的动画 [C] 基于位置的动画[D] 基于时间的动画 4、下面是图像文件格式的有（ ABCD ）。 [A] TGA [B] EPS [C] PCX [D] PNG 5、Flash所完成的动画格式主要有（ AB ）。 [A] .fla [B] .swf [C] .jpeg [D] .gif 6、在Flash中，根据声音同步设置的不同，可以将动画中涉及的声音分成（ AB ）。 [A] 事件声音[B] 数据流声音 [C] 同步声音[D] 测试声音 二、【判断题】(本大题共10小题，每小题2分，共20分)正确的填T，错误的填F，填在答题卷相应题号处。 7、在Fireworks中，“锐化”滤镜可以增强图像中相邻像素的对比度，使图像清晰化，</p><h2>高级网页设计课程教学方案</h2><p>高级网页设计课程 教学方案</p><p>《高级网页设计》课程教学大纲 一、课程的基本情况 课程中文名称:高级网页设计 课程英文名称：Advanced Web Design 课程编码： 课程类别：专业课 课程性质：必修课 总学时：72 讲课学时：40 实验学时： 32 学分：4 授课对象：计算机应用技术（专&电专） 前导课程：数据库原理、Java程序设计 二、教学目的 高级网页设计是相对于传统的ASP技术而言的，本课程的最终目的是要求学生掌握使用VS 开发简单的Web网站，其主要内容有https://www.wendangku.net/doc/da15014168.html,网站的运行环境、Web服务器控件的使用、使用https://www.wendangku.net/doc/da15014168.html, 访问数据库、Web服务的创立与使用、网站导航与母版的使用、https://www.wendangku.net/doc/da15014168.html, Ajax等。 三、教学基本要求 第1章高级Web程序设计概述 1.1 Web应用与B/S体系结构 1.1.1 从桌面应用程序到Web应用程序 1.1.2 B/S体系结构</p><p>1.1.3 网页设计与Web程序设计 1.2 动态网页与动态网站 1.2.1 Web服务器与Web站点 1.2.2 动态网页及其主要特征 1.2.3 网站工作模式 1.2.4 三种高级Web技术比较 1.3 高级Web程序设计技术基础 1.3.1 CSS样式技术 1.3.2 客户端脚本技术—JavaScript 1.3.3 面向对象编程 1.3.4 脚本编程语言 1.3.5 MVC开发模式 1.3.6 Ajax技术简介 1.3.7 XML基础 1.4 含有数据库访问的Web程序设计 1.4.1 文件型数据库 1.4.2 数据库服务器 1.4.3 数据库访问技术 习题1 实验1 高级Web应用开发基础 基本要求：了解基于对象的程序设计的思想、XML文件格式。重点与难点：Ajax技术。</p><h2>网页制作的教学设计</h2><p>网页制作的教学设计 一、教学目标 1 、知道站点、主页的概念，能在指定位置建立只有一个网页的站点； 2 、认识FRONTPAGE 的界面； 3 、掌握在主页中插入文字、图片、水平线； 4 、掌握页面文件与图片的保存。 二、教学重点 1 、能在指定位置建立只有一个网页的站点（难点） 2 、能在页面中插入文字、图片、水平线 3 、掌握页面文件与图片的保存（难点） 三、学情分析 学生已经学习了WORD 、POWERPOINT 与上网浏览信息，对计算机的基本操作（WORD 中文档的编辑，网页的浏览等）比较熟练。这使得学生主动探索、自主学习成为可能。每位学生必须完成基本任务，有能力的学生还可以完成提高篇的学习，以充分发挥学生的积极性与自主性。 四、教学方法 在教学中，一方面采用比较教学的方法，促进学生知识的迁移；另一方面，提供学生一个导学课件，让学生根据这个网络环境下的课件自己探索学习，以满足不同层次学生的需求。 五、教学过程设计 教师活动：1 、引入课题：（激发兴趣，活跃气氛） 同学们喜不喜欢上网？经常上新浪、西祠胡同等，有没有同学知道新浪、西祠胡同称做什么？（网站） 浏览新浪网站，浏览的第一个页面称为什么？（主页） 我们还可以浏览其它的页面，点击超链接浏览，当鼠标变成手指的形状时有超链接。 问题1 ：网站是不是就是网页？用自己的语言描述一下网站的概念（网站包含多个网页，</p><p>通过超链接把不同的页面链接起来） 问题 2 ：网页是不是就是主页？( 第一个页面称为主页, 网站设计者可以确定哪一个是主页, 主页的文件名一般为：index.htm, 主页也是网页) 设计网站一般必须经过两个步骤，首先是在计算机里做好，然后发布在internet 上，让所有的人访问浏览。 今天我们学习用Frontpage 建立站点，制作一个主页。 先来研究一下没有发布的网站, 打开教师做的网站 问：同学们看到了什么？（文件夹） 总结： 可以这样理解网站：在资源管理器里，网站表现为一个文件夹，里面存放的是所有与网站相关的文件。 打开主页，浏览页面，这是老师做的一个导学课件，将帮助大家完成学习任务。 请学生浏览教师课件，了解学习任务 2 、新建站点 FP 的启动 问：与word 比较，有什么不同？ （增加了视图区，编辑区有三个窗口） 总结： 视图区：多种视图模式是为了方便网站的管理。制作网页时，必须在网页视图中编辑页面 普通窗口：鼠标在闪动，可编辑、修改页面，所见即所得的方式 预览窗口：浏览器中出现的效果，与PowerPoint 中的“放映幻灯片”类似。 Html 窗口：编写HTML （超文本标记语言，它是描述网页内容和外观的标准。） 打开导学软件，根据步骤，示范建立只有一个网页的站点，强调新站点的位置、路径的正确输入，站点的名称。</p><h2>网页设计与制作试卷(七)</h2><p>2011年春季学期理论考试 网页设计与制作试卷（七） （试卷满分100分考试时间90分钟） 班级学生学号得分 一、选择题(共20分，每题1分 ) 1、常用的网页制作工具有（） A、word B、Excel C、Dreamweaver D、VB 2、常用的网页美化工具有（） A、word B、Fireworks C、Excel D、VB 3、常用的网页中的脚本语言有（） A、VBScript B、Fireworks C、Excel D、VF 4、下列哪一个不属于“网页设计三剑客”（） A、Flash B、Fireworks C、Dreamweaver D、FrontPage 5、E-mail链接的作用是（） A、用于看图 B、便于浏览者反馈意见 C、便于写E-mail D、没用 6、空链接的作用是（） A、超链接到网页 B、便于浏览 C、激活网页中的图像 D、没用 7、要是浏览者不用离开当前的Web页面就可以得到一个额外的信息可以使用（） A、超链接 B、活动图片 C、静态图片 D、脚本链接 8、Dreamweaver中的图层相当于（） A、Word中的图层 B、Excel 中的图层 C、Photoshop中的图层 D、FrontPage 中的图层 9、Dreamweaver中的图层中可包括（） A、动画 B、各种插件 C、其他图层 D、以上全包括 10、向Dreamweaver中的图层中添加图像之前必须（） A、打开图层 B、激活图层 C、选择图层 D、以上全包括 11、向Dreamweaver中的图层添加背景图像之前必须（） A、打开图层 B、激活图层 C、选择图层 D、以上全包括 12、用Dreamweaver制作的幻灯片，和用Flash制作的相比（）</p><h2>高级网页设计 课程教学方案</h2><p>《高级网页设计》课程教学大纲 一、课程的基本情况 课程中文名称:高级网页设计 课程英文名称：Advanced Web Design 课程编码： 课程类别：专业课 课程性质：必修课 总学时：72 讲课学时：40 实验学时： 32 学分：4 授课对象：计算机应用技术（专&电专） 前导课程：数据库原理、Java程序设计 二、教学目的 高级网页设计是相对于传统的ASP技术而言的，本课程的最终目的是要求学生掌握使用VS2008开发简单的Web网站，其主要内容有https://www.wendangku.net/doc/da15014168.html,网站的运行环境、Web服务器控件的使用、使用https://www.wendangku.net/doc/da15014168.html,访问数据库、Web服务的创建与使用、网站导航与母版的使用、https://www.wendangku.net/doc/da15014168.html, Ajax 等。 三、教学基本要求 第1章高级Web程序设计概述 1.1 Web应用与B/S体系结构 1.1.1 从桌面应用程序到Web应用程序 1.1.2 B/S体系结构 1.1.3 网页设计与Web程序设计 1.2 动态网页与动态网站 1.2.1 Web服务器与Web站点 1.2.2 动态网页及其主要特征 1.2.3 网站工作模式 1.2.4 三种高级Web技术比较 1.3 高级Web程序设计技术基础 1.3.1 CSS样式技术 1.3.2 客户端脚本技术—JavaScript</p><p>1.3.3 面向对象编程 1.3.4 脚本编程语言 1.3.5 MVC开发模式 1.3.6 Ajax技术简介 1.3.7 XML基础 1.4 含有数据库访问的Web程序设计 1.4.1 文件型数据库 1.4.2 数据库服务器 1.4.3 数据库访问技术 习题1 实验1 高级Web应用开发基础 基本要求：了解基于对象的程序设计的思想、XML文件格式。 重点与难点：Ajax技术。 第2章https://www.wendangku.net/doc/da15014168.html,网站及其集成开发环境 2.1 https://www.wendangku.net/doc/da15014168.html,与ASP比较 2.1.1 .NET框架体系 2.1.2 https://www.wendangku.net/doc/da15014168.html,功能介绍 2.1.3 https://www.wendangku.net/doc/da15014168.html,网站与ASP网站的区别 2.1.4 .NET项目与https://www.wendangku.net/doc/da15014168.html,网站的关系 2.2 VS 2008集成开发工具介绍 2.2.1 Visual Studio 2008概述 2.2.2 代码窗口与设计窗口同步显示 2.2.3 VS 2008的联机帮助 2.3 使用VS 2008开发https://www.wendangku.net/doc/da15014168.html,网站的一般步骤 2.3.1 新建https://www.wendangku.net/doc/da15014168.html,网站 2.3.2 新建Web窗体页 2.3.3 在VS 2008中浏览网站与网页 2.3.4 在VS 2008中新建安装项目 2.4 https://www.wendangku.net/doc/da15014168.html, Web窗体模型 2.4.1单文件页模型 2.4.2 代码隐藏页模型 2.5 https://www.wendangku.net/doc/da15014168.html,窗体页面语法 2.5.1 Web窗体代码模型</p><h2>网站设计与制作试卷和答案</h2><p>第一部分应知考试题库 2.1.2网页制作基础 1．填空题 （1）网页一般分为（）网页和（）网页。 （2）HTML是（）的缩写，意思为（）。（3）网页主要由（）、（）、（）、超链接等基本元素构成。（4）常用的制作网页的专门工具有（）和（）。 （5）如果属性面板被隐藏了，可以通过执行（）菜单下的“属性”命令来打开。2．选择题 （1）下面文件属于静态网页的是______。 （2）属于网页制作工具的是______。 A.photoshop B.flash C.dreamweaver D.cuteFTP （3）用于调整编辑窗口中被选中元素的属性的面板是_____ A.插入面板 B.属性面板 C.设计面板 D.文件面板 （4）在网页中经常用的两种图像格式是_______。 A.bmp和jpg B.gif和bmp C.png和bmp D.gif和jpg （5）下列说法正确的是_____。 A.动态网页使用应用程序解释器但不使用后台数据库 B.动态网页不使用应用程序解释器但使用后台数据库 C.动态网页不使用应用程序解释器也不使用后台数据库 D.动态网页使用应用程序解释器也使用后台数据库 2.1.3网站的创建与管理 1．选择题 （1）如果正在编辑的文件没有存盘，系统在文件名上加上____符号提示用户。 A.! B. C.# D.* （2）在“资源面板”中没有列出的资源是______。 A.文本 B.图像 C.颜色 D.脚本 （3）保存网页文档的快捷键是__________。 A.Ctrl+A B.Ctrl+S C.Ctrl+W D.Ctrl+N （4）下列哪一种视图不属于“文件面板”中视图列表中的视图类型 A.本地视图 B.地图视图 C.远程视图 D.大纲视图 （5）定义站点时，存放网页的默认文件夹为__________。 A.C盘根目录 B.D盘根目录 C.我的文档 D.没有默认文件夹，必须由用户指定 2.1.4页面的整体控制 1．选择题 （1）打开页面属性对话框，使用_______功能键。 A.Ctrl+K B.Ctrl+J C.Ctrl+M D. Ctrl + F （2）下面的颜色中，____表示黄色。 A.#FFFF00 B.#FFOOFF C.#00FFFF D.#00FF00 （3）当网页既设置了背景图像又设置了背景色，那么_____。 A.以背景图像为主 B.以背景色为主</p><h2>网页制作技术期末综合习题</h2><p>网页制作技术期末综合习题 一、填空题 1．Dreamweaver MX有______种工作界面。 2．在站点中建立新的网页文件，其默认的文件扩展名为_________。 3．打开站点面板时，可执行__________菜单中的“站点”命令。 4．如果不想在段落间留有空行，可以按__________组合键。 5．为了让浏览者快速了解图像的概况，在Dreamweaver MX提供了设置__________的功能。 6．单元格内间距是指单元格内的对象与单元格__________之间的距离。 7．单元格间距是指单元格与__________之间的距离。 8．为了使所设计的表格在浏览网页时，不显示表格的边框，应把表格的边框宽度设为_______。 9．在表格的__________中可以插入另一个表格，这称为表格的嵌套。 10．表格的嵌套是指在一个表格中插入另一个表格，表格的平铺是指将不同的表格放置在网页的____________。 11．为了加快下载速度，尽量_______整个网页的内容放在一个大的表格中。 12．在_________视图中，可以使用拖动鼠标的方法在页面中绘制布局单元格。 13．在_________视图中，可以使用拖动鼠标的方法移动单元格的位置。 14．在Dreamweaver MX中，可以插入文本框的类型有单行文本框、多行文本框和__________。 15．在网页种插入文本框、单选框、多选框或跳转菜单时，要先插入空白的_________。 16．在表单中可以插入的按钮包括提交按钮、重置按钮和___________。 17．在包含框架的页面中，每个框架都显示一个________。 18．保存包含框架的页面时，如果页面中包含四个框架，要保存全部页面信息，共需要保存______个文件。每个文件的扩展名都为htm。 19．在保存框架文件时，框架的文件名必须以字母开头且________大小写。 20．浏览器在第一次装载文框架网页时，如果需要指定该框架所显示的网页文件，则要设置该框架的______________属性。21．如果链接的目标文件在本地站点中，可以使用绝对URL或相对URL，如果要链接站点以外的目标文件，则必须使用______________。 22．创建锚链接之前，必须在页面中失当的位置____________。 23．锚链接所起到的作用，就是在页面中起到________的作用，节约查找信息的时间。 24．建立与电子邮件的超链接时，在属性面板的链接文本框中输入__________+电子邮件地址。 25．在制作文本超链接时，建立了超链接德文本__________发生了变化，并且多了一条下划线。 26．使用_____________可以改变页面中建立超链接文本的显示属性。 27．使用_______________可以将格式与网页结构分离，同时可以控制多个网页稳当。 28．通过层可以非常精确地对页面中的________定位。 29．___________是指包含在另一个层中的层。 30．如果选中多个层，_______________的一个层调整柄一黑色突出显示，其他被选中层的调整柄以白色显示。 31．利用属性面板使多个层实现左对齐的操作时，选中多个层后应该在属性面板的_______文本框中输入数值。 32．默认情况下，层的__________值是按照层的创建顺序依次增加。该值大的层显示在层的上面。 33．用户与网页进行简单交互时，若不使用服务器端的应用程序，可以使用javascript脚本外还可以使用Dreamweaver MX 提供的__________功能。 34．使用时间轴面板可以设置各个____________的显示属性以及整个时间轴的播放顺序。 35．_____________是动画条中为对象设置位置、大小、颜色等属性的帧。 36．用鼠标拖动动画条，可以调整其在时间轴的位置，从而可以改变对象的持续时间。 52．在文档窗口中，用拖动弹出式菜单边框位置可以设置其相对于触发对象位置，用这种方法只能确定_______________的</p><h2>网页设计与制作试卷试题(附答案)</h2><p>“双语”教育2012-2013第2学期 《网页设计与制作》 年级专业：学号姓名： 一、单选题（共45小题，每小题1分，共45分） 1、在网站设计中所有的站点结构都可以归结为【 B 】 A、两级结构 B、三级结构 C、四级结构 D、多级结构 2、在客户端网页脚本语言中最为通用的是【 A 】 A、javascript B、VB C、Perl D、ASP 3、所学网布局的方法是【 E 】 A、表格 B、布局 C、层 D、DIV E、都是 4、在HTML中，标记<font>的Size属性最大取值可以是【 C 】 A、5 B、6 C、7 D、8 5、所学网页页面构成有【 E 】 A、顶部（标题） B、底部（注释） C、正文 D、导航 E、都有 6、用户登陆页面不可能用到的是【 B 】 A、服务器行为检查新用户 B、绑定字段 C、用户身份验证 D、建立数据库 7、成绩录入系统不能用到的【 C 】 A、建立数据库 B、绑定插入记录集 C、检查表单 D、重复区域 8、非彩色所具有的属性为【 C 】 A、色相 B、饱和度 C、明度 D、纯度 9、下面说法错误的是【 D 】 A、规划目录结构时，应该在每个主目录下都建立独立的images目录</p><p>B、在制作站点时应突出主题色 C、人们通常所说的颜色，其实指的就是色相 D、为了使站点目录明确，应该采用中文目录 10、目前在Internet上应用最为广泛的服务是【B 】 A、FTP服务 B、WWW服务 C、Telnet服务 D、Gopher服务 11、Web安全色所能够显示的颜色种类为【C 】 A、4种 B、16种 C、216种 D、256种 12、为了标识一个HTML文件应该使用的HTML标记是【C 】 A、 B、<boby> </body> C、<html> </html> D、<table> </table> 13、框架结构页面正确的说法是【 D 】 A、点击左边导航显示右边 B、只能链接图片 C、框架页面为新建常规页面 D、插入可编辑区域可以生成模板 14、显示页面设计时不能用到的是【 D 】 A、建立数据库 B、设置数据源 C、连接数据库 D、更新记录集 15、对远程服务器上的文件进行维护时，通常采用的手段是【B 】 A、POP3 B、FTP C、SMTP D、Gopher 16、下列Web服务器上的目录权限级别中，最安全的权限级别是【A 】 A、读取 B、执行 C、脚本 D、写入 17、Internet上使用的最重要的两个协议是【B 】 A、TCP和Telnet B、TCP和IP C、TCP和SMTP D、IP和Telnet 18、网页的特征是【 A 】 A、HTML文档的基本特征——超文本 B、标识语言，网页中不能没有标记（Tag） C、网页提供了一些措施以防在网上冲浪的过程中迷失方向 D、网页实现了对原文档信息的无限补充或扩展 19、与上网无关 ．．的协议是【 C 】 A、HTTP B、SMTP C、SOKET D、POP3 20、设置字体大小的代码是【D 】</p><h2>网页制作技术B</h2><p>中山火炬职业技术学院《网页制作技术》练习册 专业： 班级： 姓名： 学号： 2011年5月26日制</p><p>《网页制作技术》习题二 一、选择题（30分，每题2分） 1、浏览器是显示网页信息的工具，以下那种不是浏览器？（） A、IE B、Netscape Navigator C、火狐浏览器 D、163 2、以下错误的是（）。 A、动态网页的扩展名是固定的，只能是.aspx 。 B、浏览一个Web站点时，一般自动显示该站点的主页。 C、定义网页中的标题用<head></head>标签。 D、网页在计算机中是以纯文本文件格式存储的。 3、若希望在新开的浏览窗口中打开链接内容，则超链接目标框架设置应为：（） A、_self B、_blank C、_parent D、_aa 4、定义表格的行可以使用（）标签。 A、<td> B、<br> C、<tr> D、<hr> 5、在Dreamweaver中，下面关于布局表格属性的说法错误的是（）。 A、可以设置宽度 B、可以设置高度 C、可设置表格的背景颜色 D、不能设置单元格之间的距离 6、以下( )不是网页文件的后缀。 A、*.php B、 *.ppt C、*.htm D、 *.html 7、在Dreamweaver中，下面关于层的说法错误的是（）。 A、不可以改变重叠的次序 B、可以改变层的大小 C、层可以被定位于网页的任何地方 D、可以设定层的可是否见与否可见 8、在Dreamweaver中，下面关于CSS的说法错误的是：( )。 A. CSS语法格式中有几个不同的属性，中间用逗号隔开 B. 一般用“标签属性：属性数值”来表示CSS语法格式 C. CSS定义一般是由标签、大括号构成 D. CSS语法中的大括号中放置此标签的属性 9、在Dreamweaver中超链接标签有四种不同的状态。下面不是其中一种状态的是（）。 A、 a:visited B、a:active C、a:link D、 a: br 10、以下那种声音文件格式不可以导入到FLASH中？（） A、MID格式 B、ggo格式 C、MP3格式 D、WAV格式 11、在Dreamweaver 中，对已有的样式表不可以进行的操作是（） A、合并或拆分 B、修改 C、删除 D、复制 12、在Dreamweaver中，下面关于CSS语法的颜色表达方法错误的是（）。 A、在颜色属性中可用关键字，如green</p><h2>《网页制作》教学设计(优质课比赛优秀设计)</h2><p>《网页制作》教学设计（优质课比赛优秀设计）《网页制作》教学设计 一、教材或教学内容分析 本章内容在本教材中的位置处于第五章，是在文字处理(Word2000)和网络基础及因特网应用两章之后。学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品，在软件的使用上有很多的共通之处，所以在学习frontpage的时候，很多内容可以让学生自学，而不必面面俱到地在课上讲授。而第四章网络基础及因特网的应用又为学生对网页的理解奠定了基础，学生对网页中的基本元素——文字、图片、动画、声音等都有所了解，而网页的制作就是将这些元素重新组合到网页上，学生要学的就是这种组合的方法。所以说，虽然大多数学生以前都未接触过网页的制作，但有了以上这些基础，学起来就轻松多了。 本章内容按照学生已有的基础，我对教学内容分了一下类，也为教学的组织工作打下一点基础。本章内容主要由网页基础知识、网站的建立和管理、网页的制作、创建超链接、图片的处理、网页框架。 重点是网页的制作和创建超链接，学会了这些就可以开始简单的网页制作了。 难点是网页框架，这部分相互之间关系比较复杂，必要时，老师在对各组个别辅导时，可以给予分别讲解。 这个分类可以为组长安排各个组员的任务提供参考，使分工更加合理。 二、教学对象的分析 第 1 页共 6 页 信息技术课虽然已经成为初中的必修科目，但是城乡学生之间掌握情况的差异却相当大，条件好一点的初中学生不仅已经熟练掌握了课本上的内容，还对一些常</p><p>用软件有所了解;而差一点的可以说是从高中开始才正式接触到信息技术知识的学习，他们需要多锻炼、多指导，所以协作学习对学生的学习帮助很大。 三、教学策略的选择及媒体的使用 在教学策略的选择上，我使用的是任务驱动和协作学习相结合的方法。 任务驱动就是要求本章内容学习完之后，每个小组都要完成自己班级网站的制作，并在全班进行评比，选择最好的作为班级主页挂到学校主页上去，这有助于激发学生参与学习的积极性。 协作学习则是让学生在学习过程中互帮互助，用较短的时间、教少的精力学到更多的东西，完成一个集体项目，让他们在学习之后获得成就感。因此在媒体的选择上，我们使用的是TOP2000系统。TOP2000系统有利于教师进行分组教学和学生作品的点评及成果的展示。教学过程开始之前，教师把学生按座位分成四组，每个组都按学生对计算机的掌握程度平均分配，保证每个组都有计算机操作方面比较突出的，也有相对比较差的，使其形成能够互帮互助的学习小组。并由他们自己选出组长各一名，然后由组长根据组员的情况，确定在班级主页制作过程中主要完成什么任务，也就是说起到一个组织者的作用。做过网页的人都知道，做网页是一项比较费时的工作，而要学生在较短的时间内制作出像样的网页是比较困难的，而在这个过程中，网页的设计占去了相当多的一部分时间，组长把任务分到各组员头上以后，组员就可根据自己要完成的任务相对集中的做某方面的工作，做完以后，组员之间进行经验交流，告诉组员自己的网页是如何制作出来的，在完成自己的网页后，再重复一遍制作过程花费的时间的不多的。这样，其他组员就可在较短的时间之内 第 2 页共 6 页 掌握比较先进的网页制作方法，而不必再花那么多时间去探索。因为每位组员都必</p></div> </div> <div> <div>相关文档</div> <div class="relatedtopic"> <div id="tabs-section" class="tabs"> <ul class="tab-head"> <li id="1661794"><a href="/topic/1661794/" target="_blank">网页制作教案</a></li> <li id="9477233"><a href="/topic/9477233/" target="_blank">网页制作课程教案</a></li> <li id="20667511"><a href="/topic/20667511/" target="_blank">网页制作技术</a></li> <li id="13137513"><a href="/topic/13137513/" target="_blank">高级网页制作技术</a></li> <li id="13003466"><a href="/topic/13003466/" target="_blank">网页制作技术试卷</a></li> <li id="17382047"><a href="/topic/17382047/" target="_blank">网页制作技术教程</a></li> </ul> </div> </div> </div> </div> <div class="category"> <span class="navname">相关文档</span> <ul class="lista"> <li><a href="/doc/cf16321311.html" target="_blank">网页设计与制作教案 </a></li> <li><a href="/doc/3639500.html" target="_blank">网页制作教案</a></li> <li><a href="/doc/fa11329763.html" target="_blank">《网页设计与制作》教案教学教材</a></li> <li><a href="/doc/3215193173.html" target="_blank">网页设计与制作电子教案.doc</a></li> <li><a href="/doc/7c879367.html" target="_blank">动态网页制作教案</a></li> <li><a href="/doc/ab15738526.html" target="_blank">网页制作教学设计与反思</a></li> <li><a href="/doc/ef5978693.html" target="_blank">网页设计与制作教案设计</a></li> <li><a href="/doc/3010507745.html" target="_blank">《网页设计与制作》课程教学设计</a></li> <li><a href="/doc/4414729482.html" target="_blank">网页设计与制作教案46186</a></li> <li><a href="/doc/7919017074.html" target="_blank">动态网页制作教案</a></li> <li><a href="/doc/bf11341246.html" target="_blank">网页制作教学设计(公开课)</a></li> <li><a href="/doc/152236407.html" target="_blank">《网页制作》教案设计</a></li> <li><a href="/doc/fb395653.html" target="_blank">网页制作教学设计</a></li> <li><a href="/doc/3d13689837.html" target="_blank">网页设计与制作教案</a></li> <li><a href="/doc/6111113147.html" target="_blank">网页制作教案</a></li> <li><a href="/doc/968374253.html" target="_blank">网页设计与制作教案</a></li> <li><a href="/doc/e05642775.html" target="_blank">《网页制作教学设计》教案</a></li> <li><a href="/doc/387946553.html" target="_blank">Dreamweaver CS5网页制作-电子教案1</a></li> <li><a href="/doc/484457904.html" target="_blank">简单网页制作教学设计</a></li> <li><a href="/doc/7517983189.html" target="_blank">网页设计与制作教案免费学技术改变生活</a></li> </ul> <span class="navname">最新文档</span> <ul class="lista"> <li><a href="/doc/0719509601.html" target="_blank">幼儿园小班科学《小动物过冬》PPT课件教案</a></li> <li><a href="/doc/0e19509602.html" target="_blank">2021年春新青岛版(五四制)科学四年级下册 20.《露和霜》教学课件</a></li> <li><a href="/doc/9319184372.html" target="_blank">自然教育课件</a></li> <li><a href="/doc/3019258759.html" target="_blank">小学语文优质课火烧云教材分析及课件</a></li> <li><a href="/doc/db19211938.html" target="_blank">(超详)高中语文知识点归纳汇总</a></li> <li><a href="/doc/af19240639.html" target="_blank">高中语文基础知识点总结(5篇)</a></li> <li><a href="/doc/9919184371.html" target="_blank">高中语文基础知识点总结(最新)</a></li> <li><a href="/doc/8b19195909.html" target="_blank">高中语文知识点整理总结</a></li> <li><a href="/doc/8019195910.html" target="_blank">高中语文知识点归纳</a></li> <li><a href="/doc/7f19336998.html" target="_blank">高中语文基础知识点总结大全</a></li> <li><a href="/doc/7a19336999.html" target="_blank">超详细的高中语文知识点归纳</a></li> <li><a href="/doc/6719035160.html" target="_blank">高考语文知识点总结高中</a></li> <li><a href="/doc/6a19035161.html" target="_blank">高中语文知识点总结归纳</a></li> <li><a href="/doc/4d19232289.html" target="_blank">高中语文知识点整理总结</a></li> <li><a href="/doc/3a19258758.html" target="_blank">高中语文知识点归纳</a></li> <li><a href="/doc/2519396978.html" target="_blank">高中语文知识点归纳(大全)</a></li> <li><a href="/doc/2419396979.html" target="_blank">高中语文知识点总结归纳(汇总8篇)</a></li> <li><a href="/doc/1f19338136.html" target="_blank">高中语文基础知识点整理</a></li> <li><a href="/doc/ef19066069.html" target="_blank">化工厂应急预案</a></li> <li><a href="/doc/bc19159069.html" target="_blank">化工消防应急预案(精选8篇)</a></li> </ul> </div> </div> <script> var sdocid = "dc8d16c0aa00b52acfc7ca4f"; </script> <div class="footer"> <p><a href="/tousu.html" target="_blank">侵权投诉</a>  © 2013-2023 www.wendangku.net  <a href="/sitemap.html">站点地图</a> | <a href="https://m.wendangku.net">手机版</a></p> <p><a href="https://beian.miit.gov.cn" target="_blank">闽ICP备11023808号-7</a>  本站文档均来自互联网及网友上传分享，本站只负责收集和整理，有任何问题可通过上访投诉通道进行反馈</p> </div> <script type="text/javascript">foot();</script> </div> </body> </html>