使用模板和库制作网页(精)
中等职业学校《网页制作》的课程标准
XXXX中等职业学校《网页制作》的课程标准一、课程的性质与任务（一）课程性质《网页制作》是我校计算机应用专业开设的一门专业必修课，是计算机类专业的一门实践环节课程，也可以作为其他相关专业的实践课程或选修课，它是一门操作性和实践性很强的职业技术课程。
本课程的主要内容为系统介绍网页编辑与制作软件AdobeDreamweaverCS3,通过这种有代表性的网页制作软件的使用，掌握网站设计的全过程，并能熟练地制作出有专业水准的网站。
（二）课程任务本门课程在专业教学计划中起着十分重要的作用，通过这门课程,学生可以掌握以下技能和知识：1.掌握网站的开发流程，如建站规划、效果图制作、建立站点、发布网站等相关知识。
2.掌握各种网页元素在DremweaverCS3中的使用。
例如，文本、表格、图像、超级链接、层、框架和表单等。
3.掌握HTML,理解各种标记的功能和用法。
4.掌握在DrenIWeaVerCS3中使用CSS控制网页元素的方法。
5.掌握在DrenIWeaVerCS3中使用JavaScript制作网页特效的基本方法。
6.能够解决一些网页设计中的常见问题。
（三）本课程的特点1.课程注重实际应用，即实践性强。
2.涉及的DremweaverCS3软件是目前网页制作工作中较为流行的软件，是“网页三剑客”之一，具有较强的实践性，学习难度不大。
3.突出理论联系实际，实作课时占总课时的50%以上，实际应用知识占课程总知识量的80%以上。
（四）与相关课程的衔接、配合、分工先修课程：“计算机应用基础”、“图形图像处理（FireWorkS或PhotoShop）"、"Flash动画制作”等。
二、课程目标本课程的基本目标是：使学生通过本课程的学习，掌握DreanIWeaVerCS3的使用方法，学会使用DreamweaverCS3制作Web网页的技术。
本课程学习结束后，学生应能根据实际需要自行设计静态网页，建立网站。
项目驱动式教学法在《网页设计》课程中的应用与研究
项目 名称． 周次
币 作 ｑ 第一周
—
课程内容
任务 １创建站 点与浏览 网页
任务
任务 １ ． １ 创建本地站 点 “ 乐游天下 ” 任务 １ ． ２ 认识 Ｄ ｒ ｅ ａ ｍｗ ｅ ａ ｖ ｅ ｒ Ｃ Ｓ ６的工作界 面 任务 １ ． ３ 打开 与保存 网页文档 任务 １ ． ４ 在浏 览器中浏览网页 任务 ２ ． １ 制作总览旅游景点的文本网页 任务２ ． ２ 制作介绍中 国名河的文本 网页 任 务 ２３ 制作介绍中 国名山的文本 网页 任务 ３ ． １ 制作介绍 中国瀑布的 图文混排网页 任务 ３ ． ２ 制作介绍 中国名泉的 图文混排网页 任务 ３３ 制作 介绍中国名岛的 图文混排 网页
第六周至第七周
任务 ５ 制作包含超级链接和 Ａ Ｐ Ｄ ｉ ｖ的网页 任务 ６ 使用模板和库制作 网页
任务 ５ ． １ 制作包含超级链接的展示张家界景点的网页 任务 ５ ． ２ 制作包含超级链接的展示桂林旅 游景点的 网页 任务 ５ ． ３ 制作包含超级链接的介绍 中国名河的网页
第八周至第九周
主 要 采 用 的 还 是 案 例教 学 法 、 任 的课 程 ， 它要 求学 生能 够综 合运 用 图片处 理 法 有很 多 ，
学 生 以小 组 或 个 人等 不 同 组 织 形 式 ， 目 为 了达 到 培 养 学 境 ， 软件 、 网页 制作 软件 、 动 画 制 作软 件 ， 完 成各 务 驱 动 法 和项 目教 学 法 。 绕 “ 项 目” ， 通 过 查找 文献 、 调 查研 究 、 讨论 每 生 能 完 成 实 际 工 作 任 务 的职 业能 力 目标 ， 种类 型 网站 的 静态 页面 的 设计 及 制 作 。 通过
《网页设计与制作》课程简介
《网页设计与制作》课程简介课程名称：网页设计与制作课程代码：02038适用专业：初等教育（计算机与信息技术方向）课程性质：专业核心课程、必修课、专业技能课学分：3 学分计划学时：72学时（理论36学时，实训36学时）一、前言1. 课程性质本课程是初等教育计算机与信息技术专业的一门专业技能课程，培养学生网页设计与制作能力，适应初等教育对信息技术教师的人才基本要求，同时满足社会对计算机专业人才的需求，适合从事网站建设相关的岗位。
本课程的先修课程是《计算机应用基础》，后续课程是《程序设计》。
在完成《计算机应用基础》课程学习后，学生掌握了计算机基本知识和原理，学会了一些应用软件和工具软件的使用，进而学习《网页设计与制作》这门课程不会感到困难。
在以后学生还将学习《程序设计》课程，能设计和制作动态网页。
2. 课程基本理念初等教育计算机与信息技术专业培养的对象主要是小学信息技术教师，今后从事小学信息技术教学和学校信息化教育教学的管理者及维护者，建设网站和网页是信息技术教师应掌握的基本技能。
课程要理论与实践相结合，培养学生动手能力，能胜任今后小学信息技术教师的工作任务。
同时满足社会对计算机专业人才的需求，适合从事网站建设相关的岗位群。
3. 课程设计思路根据初等教育计算机与信息技术专业人才培养方案，《网页设计与制作》是重要的专业技能课程，是作为小学信息技术教师基本技能训练与考核的项目之一。
课程以工作任务来组织内容，以案例驱动贯穿教学过程。
由浅入深，最后完成主题网站的开发项目。
课程教学中以Dreamweaver的使用为主线，要重视HTML语言和CSS样式的讲解和应用。
通过以3—4人为小组完成主题网站的建设，培养沟通能力、合作能力和团队协作能力，为今后的职业生涯打下良好的基础。
二、课程目标1. 总体目标本课程以学生能独立完成静态网站开发和维护的实际工作能力为学习目标，要求学生掌握HTML语言的文档结构和基本标签使用。
国开2020《网络信息制作与发布》形考任务汇总
答案+我名字大作业1：网络专题的设计【目标】完成网络专题的设计与材料的搜集、整理、加工。
【时间】约240分钟。
【步骤】1.根据自己的需要，确定专题的主题。
2.分析与思考，并回答以下几个问题：Ÿ为什么要选择这个专题？Ÿ这个专题准备给谁看？Ÿ通过这个专题，收到什么效果？3.初步编写策划设计方案，方案应包括以下内容：标题：××××专题策划案策划人：×××策划时间：××年××月××日正文：专题主题：××××××专题关键字：××××专题说明：……创意说明：……版式设计：…附图（版式与结构）材料分类：4.根据策划设计方案确定的栏目，利用搜索引擎等进行相关材料的搜集、整理。
5.对主要文字稿件进行必要的修改加工。
6.对多媒体素材进行修改加工。
大作业要求：1.需要提交的材料有：专题设计方案、文字稿件、多媒体素材。
2.多媒体素材包括图片、图表、音频、视频等，要求不少于2种。
3.大作业以WinRAR或WinZip压缩包形式上传，占形考成绩的16%。
大作业评价要点：Ÿ1.设计与网络专题定位、版面特点是否相符合。
2.Ÿ提交的材料与主题是否相关联。
Ÿ3.文字材料的整理是否恰当与适用。
Ÿ4.多媒体素材是否恰当与适用。
Ÿ5.综合评价其是否具备可操作性。
开始时间截止时间类型2020-03-01 00:00:00 2020-06-3023:59:59作业进入形考大作业2：网站站点结构的构建[目标]设计网站的布局结构，至少完成二级结构（栏目）的设计。
[时间]约120分钟。
[步骤]1.根据大作业1确定的网站主题，设计网站的布局结构，可以借鉴同类型网页的布局结构。
2.分析与思考，并回答以下几个问题：Ÿ 网站内容都包括哪些Ÿ 网站的内容根据重要性如何进行排列Ÿ 如何通过网站布局，突出重要信息3.使用Word、PowerPoint、Photoshop等绘制页面布局结构图，注明每个区域的功能，并形成文档。
《网页制作》理论试题及答案
《网页制作》理论试题及答案一、单选题1.当测览器不能正常显示图像时，会在图像的位置显示的内容__A__。
A.替代B.目标C.地图D.低品质源2.将超链接的目标网页在当前窗口中打开的方式是__D___。
A.parentB._blankC._topD._self3.当网页既设置了背景图像又设置了背景色，那么__A__。
A.以背景图像为主B.以背景色为主C.产生--种混合效果D.冲突，不能同时设置4.在页面属性对话框中，我们不能设置__C___。
A.网页的背景色B.网页文本的颜色C.网页文本的大小D.网页的边界5.在文本的属性面板中，不能设置___D__ 。
A.文字的大小和颜色B.加粗或倾斜风格C.文字的超链接D.矩形热区6.下列路径中属于绝对路径的是___A___ 。
B./xuesheng/chengji/mingci.htmC. address.htmD. staff/telephone.htm7.DreamweaverMX可以导入的表格式数据的格式是___C___。
A.Excel格式B.Word格式C.文本格式D.任意格式8.要一次选择整个行，在标签检查器中选择___B___ 标签。
A.tableB.trC.tdD.tp9.指定表格内单元格之间的间隙大小，需要设置表格属性面板中的___B___。
10.如果层中的图片太大，要设置超出部分照样显示，则"溢出"选项中应选择__A___ 。
A.visibIeB.hiddenC.scrolID.auto11.不论层中的内容是否超出，都显示滚动条，则"溢出"选项中应选择 ___C____ 。
A.visibleB.hiddenC.scrollD.auto12.利用键盘方向键移动层时，一次按键只能移动 ___A___ px。
A.lB.2C.3D.413.层的对齐万式"设成宽度相同"的含义是__B___ 。
(更新版)国家开放大学电大专科《Dreamweaver网页设计》单项多项选择题题库及答案
(更新版)国家开放大学电大专科《Dreamweaver网页设计》单项多项选择题题库及答案盗传必究一、单项选择题题目1下面关于网站策划的说法错误的是（）选择一项：A. 向来总是内容决定形式的B. 信息的种类与多少会影响网站的表现力C. 做网站的第一步就是确定主题D. 对于网站策划来说最重要的还是网站的整体风格题目2为链接定义目标窗口时，_blank表示的是（）。
选择一项：A. 在上一级窗口中打开B. 在浏览器的整个窗口中打开，忽略任何框架C. 在同一个帧或窗口中打开D. 在新窗口中打开题目3对于一个简单表单来说，下面描述正确的是（）选择一项：A. 表单元素必须使用3个以上B. 图中该表单只能使用单项按钮C. 图中“查看结果”按钮是一个表单元素D. 图中“投票”按钮不是一个表单元素题目4以下几个事件中代表“页面元素失去焦点”的事件是（）。
选择一项：A. onBounceB. onBlurC. onChangeD. onAfterUpdate题目5如下所示的这段CSS样式代码，定义的样式效果是（）。
a:link {color: #ff0000;}a:visited {color: #00ff00;}a:hover {color: #0000ff;}a:active {color: #000000;}其中#ff0000为红色，#00000为黑色，#0000ff为蓝色， #00ff00为绿色选择一项：A. 默认链接色是绿色，访问过链接是蓝色，鼠标上滚链接是黑色，活动链接是红色B. 默认链接色是蓝色，访问过链接是黑色，鼠标上滚链接是红色，活动链接是绿色C. 默认链接色是黑色，访问过链接是红色，鼠标上滚链接是绿色，活动链接是蓝色D. 默认链接色是红色，访问过链接是绿色，鼠标上滚链接是蓝色，活动链接是黑色题目6CSS是利用什么XHTML标记构建网页布局？（）选择一项：A. <dif>B. <dis>C. <dir>D. <div>题目7在【模板】子面板，如图所示，模板预览区是（）选择一项：A. 模板预览区是④B. 模板预览区是③C. 模板预览区是②D. 模板预览区是①题目8下面type标记中的square表示的是（）。
网页设计与制作PPT课件
1.1 网页和网站
1.1.3 网页的基本功能
1、媒介的作用。使用者与信息之间的媒介。 一方面是发布者，功能是发布信息；另一方面 是浏览者，功能是提供浏览的信息，通过浏览 网页找寻需要的信息。
2、互动的作用。浏览者与网页制作单位之 间互动的窗口，可以单向或双向传递信息。
3、传输的作用。作为传输各种电子文件或 信息之用，如下载说明书、更新文件、驱动程 序等。
超链接的标志一般有：文本、图像、热区 三种。要注意的是，所有超链接标志均应清晰 无误地向浏览者标识出来，让人一看就知道。
1.2 网页中的主要元素
1.2.4其他的基本要素
除上述几种要素之外，在网页上经常使用 的还有动画、视频、声音等各种信息的形式。
1．动画。目前网络上常用的动画类型有 gif和Flash动画两种。
第2讲 HTML语言基础
$ [知识目标]
了解HTML文件的基本结构 掌握HTML中文本的编辑及图像的语法 掌握HTML中各种设置超级链接的语法 掌握HTML中表格和框架的基本语法
8 [能力目标]
掌握进行文本及图像的编辑操作 掌握创建各种超级链接的操作 能够编写简单的HTML网页 掌握HTML文件中表格和框架的使用
1.4 网页设计的基本流程
1.4.3网页的测试
1．浏览器兼容性测试。目前浏览器有： Internet Explorer与Netscape两大主流浏览器，二 者对HTML和CSS等语法的支持度是不同的。在 Dreamweaver中提供了可以检查网页中是否含有某版本浏 览器不能识别的语法功能，设计者可以借助其进行检查。
1.4 网页设计的基本流程
1.4.4网页上传和发布
网页设计好，必须把它发布到互联网上， 否则网站形象仍然不能展现出去。发布的服务 器可以是远程，也可以是本地。如果是发布到 互联网上，要先申请域名和主页空间，然后再 利用专用软件（如：CuteFTP）上传，FTP有很 多种软件，最著名的是 CuteFTP 和 LeapFTP， 也可以用Dreamweaver内置的FTP上传。
项目6使用模板和库提高制作效率
项目使用模板和库提高制作效率一、教案建议模板与库是网站制作中最常用的工具，利用模板，用户可以批量制作风格一制、内容不同的网页，省去了期间繁琐的工作，而且利用模板，还可以达到使网页外观达到统一的目的；库功能即用户可以讲一些常用的资源保存在库中，待到要用时直接从库中调用该资源就可以了。
该项目通过两个任务，形象直观地介绍了模板、库在网页制作中的作用及使用方法。
该项目理论知识详尽，要求结合上机实践操作，巩固学生的理论知识，提高学生的学习兴趣，并以“项目总结”的形式通过“发现问题一一解决问题一一总结问题”的方式加深学生的印象，增强学习效果。
为了提高学生的应试能力，尤其是一些考级需要，建议教师在教案的过程中有意识地穿插该项目后面“自我评测”的操作题与该教材配套光盘中配套的实例题，让学生在实际操作的过程中解决一些问题，达到理论实践一体化的效果，以便学生更好更牢固的掌握知识点，学以致用。
、教案简案【组织教案】检查学生出勤情况，做好学生考勤记录。
强调上课课堂纪律，活跃互动教案气氛。
【课题导入】在项目中我们了解到，网站是由若干个网页组成。
而隶属同一个网站中的许多网页的设计风格相似，只是内容不同。
一个网页一个网页地制作，往往耗时且不方便控制。
像这样，在同一个网站中的网页通常都使用统一的风格，采用大致相同的网页布局结构、版式、导航条、图片和等。
为了避免不必要的重复操作，提高制作过程中的工作效率，可以使用提供的模板和库功能，将具有相同布局结构的页面制作成模板，将相同的元素制作为库项目，以便随时调用，实现批量化制作网页。
面我们来学习如何在中创建和编辑模板与库。
【技能训练】（上机实训：课时）一、项目任务任务一：使用模板制作网页。
任务二：使用库制作相似网页。
二、任务实训.学生根据该项目的任务要求进行上机操作，教师在机房巡回指导。
.完成一个任务后，教师引导学生进行总结，然后进行下一个任务。
.在完成该项目所有任务的基础上，教师结合项目后“技能巩固”的操作题及光盘中的实例题，布置课后上机题。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
项目三 布局技术
★ 小结 ★
制作网页不仅追求美观、而且要提高制 作效率，使用模板和库文件是提高网页制作效 率的有效途径。
如果我们修改了某个库项目，那么由这个库项目创建的页面
元素也会自动更新。我们也可以让文档不受库项目的控制 以便可以自由地编辑。
项目三 布局技术
资源的应用
在Dreamweaver CS3中，可以直接跟踪和预览站点中 存储的资源，如图像、影片、颜色、脚本和链接，还可 以直接拖动某个资源，将其插入到当前文档的某一页中。 还可以通过各种来源获取资源，如在应用程序 （Fireworks或Flash）中创建资源。
模板的重复区域
是模板的一部分，设置该部分可以使模板用户必要时在 基于模板的文档中添加或删除重复区域的副本。重复区 域通常与表格一起使用，但也可以为其他页面元素定义 重复区域。使用重复区域，可以通过重复特定项目来控 制页面布局，例如目录项、说明布局或重复数据行。可 以在模板中插入的重复区域的模板对象有两种：重复区 域和重复表格。 模板用户可以使用重复区域在模板中重制任意次数的指 定区域。要将重复区域中的内容设置为可编辑（如允许 用户在基于模板的文档的表格单元格中输入文本），必 须在重复区域中插入可编辑区域。
利用模板和库制作网页
在进行大量的页面制作时，很多页面会 用到相同的布局、图片和文字等元素。为了 避免重复劳动，可以使用模板和库功能，将 具有相同版面结构的页面制作成模板，将相 同的页面元素制作成库项目，并存储在库文 件中以便随时调用。
学习目标
理解模板和库的作用。 学会将已有网页生成模板的操作方法。 掌握编辑模板和将模板生成新网页的操作
项目三 布局技术
资源面板左侧的各按钮意义
图像按钮：在资源列表框中显示GIF、JPEG或PNG格式的图像文件。 颜色按钮：在资源列表框中显示文档和样式表中使用的颜色，包括文本颜色、 背景颜色、链接颜色。 URLS按钮：在资源列表框中显示当前文档中使用的外部链接，包括FTP、 Gopher、HTTP、HTTPS、JavaScript、电子邮件（mailto）、本地文 件（file://）链接。 Flash按钮：在资源列表框中显示SWF（压缩的Flash文件），而不显示FLA文 件（Flash源文件）。 Shockwave按钮：在资源列表框中显示Adobe Shockwave版本的文件。 影片按钮：在资源列表框中显示QuickTime或MPEG文件。 脚本按钮：在资源列表框中显示JavaScript或VBScript文件。HTML文件中的 脚本不出现在面板中。 模板按钮：在资源列表框中显示多个页机上使用的主页面布局，修改模板时 会自动修改附加到该模板的所有页面。 库按钮：在资源列表框中显示多个页面中使用的设计元素。当修改一个库项 目时，所有包含该项目的页面都将得到更新。
应用模板创建网页文档
单击菜单【文件】→【新建】，弹出“新建文档”对话框，在“新建 文档”对话框中选择“模板中的页”标签，选择要使用的模板，然后
单击【创建】按钮，这样将基于这个模板创建一个新的网页。
在基于模板创建的网页中，只有可编辑区域是可以进行编辑的，可编 辑区域之外的区域均被锁定。 若要将文档从模板中分离，方法是执行“修改”菜单下的“模板”中 的“从模板中分离”命令，这就使网页成为一个普通文档，不再与模 板有关系
模板创建
模板创建的方法有两种：直接创建模板或者将 普通网页另存为模板。创建模板文件和创建一个普 通页面的方法完全相同，不需要把页面的所有部分 都制作完成，仅需要制作导航条、标题栏等各个页 面的共有部分就可以了。
模板的可编辑区域
为了避免编辑时因误操作而导致模板中的元素发生变化， 模板中的内容默认为不可编辑。模板创建者可以在模板 的任何区域指定可编辑的区域，而且要使模板生效，至 少包含一个可编辑区域，否则该模板没有任何实质意义。 创建可编辑区域的方法： 方法一：单击“常用”选项卡中的“可编辑区域”按钮 方法二：直接在模板空白处单击右键，选择“模板”下 的“新建可编辑区域”选项
保存模板
Dreamweaver CS3将模板文件以文件扩展名.dwt保存在站点本 地根文件夹的Templates文件夹中。如果该文件夹在站点中不存 在， Dreamweaver CS3中将在你保存新建模板时自动创建该文 件夹。 运行菜单命令“文件/保存”，此时将出现提示信息，告诉我们 文档还未建立可编辑区域，是否继续。单击“确定”按钮则打 开“另存模板”对话框。在“另存为”文本框中输入 “Template1”，这时在模板面板中出现新建的模板。 将文档另存为模板后，文档的大部分区域就被锁定。模板创作 者在模板中插入可编辑区域或可编辑参数，从而指定在基于模 板的文档中哪些区域可以编辑。
库项目的应用
库是一种特殊的Dreamweaver CS3文件，它其中包含可
以放置到页面中的一组单个资源或资源副本。库中的这 些资源称为库项目，它与模板本质区别在于：模板本质 是一个独立的页面文件，它可以控制大的设计区域以及 重复使用完整的布局，而库项目则只是页面中的某一段 HTML代码。每当编辑某个库项目时，可以自动更新所
目是整个网站范围内重新使用或经常更新的元素，每个 库项目作为一个单独的文件（扩展名为.lbi）保存在站点本地 根文件夹下Library文件夹中，其创建方法十分简单多样。 库项目的插入 把库项目插入到文档中，与模板类似能够批量生产风格的页面。 脱离库 文档中由库项目创建的元素，会随着库项目的变化而变化，
有使用该项目的页面，使用库比模板有更大的灵活性。
库项目的应用
Dreamweaver CS3将库项目存储在每个站点的本地根 文件夹下的Library文件夹中。使用库项目时，页面中 的库是该项目的链接而不是项目本身。也就是说， Dreamweaver CS3在文档中插入的是该项目的HTML源 代码副本，并添加一个包含对原始外部项目的引用的 HTM L注释，库项目的自动更新就是通过这个外部引 用来实现的。
更新模板的变化
对模板进行修改后，可以将模板的修改应用于所有由模板生成的网页。 操作步骤如下： （1）打开模板文档，对模板进行必须的修改。 （2）单击菜单【修改】→【模板】→【更新页面】，弹出“更新页 面”对话框。 （3）在对话框中设置相应参数，在“查看”下拉列表框中如果选 择“整个站点”，则要选择更新哪个站点，如果选择“文件使用”， 则要选择更新哪个模板文件。如果选中了“显示记录”复选框，则会 在更新之后显示更新记录。
方法。 掌握如何应用库项目制作网页。
什么是模板
模板是一种特殊类型的网页文档，只是被加入了特殊的 模板信息，一般用来设计“固定的”页面布局并定义可 编辑区域，只需从模板创建网页并在可编辑区域中进行 编辑即可完成新页面的设计，大大提高了工作效率。简 单地说，模板是一种用来批量创建具有相同结构及风格 的网页的最重要手段；从模板创建的文档与该模板保持 连接状态，修改模板就可以实现基于该模板设计的网页 批量更新。