实验教学大纲模板

课程代码：网页设计基础Fundations of Webpage Design学分：3.5 总学时：56 理论学时：30 实验学时：26一、实验教学目标本门课程注重培养学生制作网页的操作能力、实践能力。主要介绍与网页设计制作有关的知识、基本技术、创建和管理网站、CSS基础知识、CSS+DIV布局网页，培养学生具有制作一般标准商业网站的能力。同时，使学生掌握可视化网站开发工具Dreamweaver的使用，使学生完成本课程的学习后，可以自己设计美观、实用的静态网站。二、实验教学基本要求1在整个实验教学过程中，要教育学生养成良好的实验习惯，爱护公共财产、遵守安全制度，树立优良的学风。2通过本实验的基本训练，要求学生做到：（1）能够自行完成设计一个用CSS+DIV布局企业网站。（2）能够熟练使用dreamweaver、photoshop等的网页开发工具。（3）掌握制作网页的基本技巧。三、实验教材或实验指导书1使用教材温谦 编著网页制作综合技术教程北京：人民邮电出版社，20092主要参考书（1）前沿科技 曾顺 编著精通CSS+DIV网页样式与布局第1版北京：人民邮电出版社，2007.（2）贾素玲, 王强主编HTML网页设计第1版北京：清华大学出版社，2007.四、考核方式与评分办法实验成绩评定分两部分：实验操作、预习占50，实验作业占50。五、实验项目设置序号实验项目名称实验学时实验类型实验要求主要设备(用品)台（套）数1认识HTML2设计必开2HTML中文本和图像设计2设计必开3HTML超链接、框架练习2设计必开4网页中表格设计2设计必开5表单练习12设计必开6表单练习22设计必开7用模板技术制作简单网站2综合必开8用CSS控制网页文本和图像2设计必开9用CSS设置链接与导航菜单2设计必开10用CSS设置表格和表单样式2设计必开11用CSS+DIV设计网页综合实例一2综合必开12用CSS+DIV设计网页综合实例二2综合必开13用Photoshop设计网页效果图2综合必开六、实验内容与实验方式实验一 认识HTML实验目的:实验内容:1. 用记事本书写第一个网页，并保存，浏览。2. 熟悉Dreamweaver 的工作界面。3. 创建网页及保存到指定路径。4. 在网页中插入普通文本。5. 在网页中插入特殊文本。6. 对插入的文本进行格式化。7. 熟悉Dreamweaver属性面版。8. 查看网页源代码。实验二 HTML中文本和图像设计实验目的:实验内容:1. 在网页中使用标记排版文字。2. 在网页中使用等文字排版工具制作简单网页。3. 在网页中用标记在网页中插入图像。4. 在网页中使用等列表标签。实验三 HTML超链接、框架练习实验目的:实验内容:1. 创建文本和图片链接。2. 创建电子邮件链接。3. 创建锚点链接。4. 链接效果的编辑。5. 创建站点的方法。6. 站点的管理方法。7. 创建个人网站，保存到指定路径。8. 注意网站中的图片放到一个文件夹下。实验四 网页中表格设计实验目的:实验内容:1. 在网页中插入表格。2. 表格单元格的合并。3. 用表格布局网页。实验五 表单练习1实验目的:实验内容:1. 在静态网页中建立表单，练习method=get递交方法。2. 建立动态的提交页面，初步认识动态网页与静态网页的区别。3. 初步认识架设iis服务器。4. 在静态网页中建立表单，练习method=post递交方法。5. 在静态网页中建立表单，练习客户端JavaScript验证方法。实验六 表单练习2实验目的:实验内容:1. 在静态网页中用表单设计注册页面。2. 练习文本框、密码框、单选按钮、复选按钮、下拉列表、多行文本、普通按钮、提交按钮、重设按钮、文件域等表单元素的用法。3. 理解每个表单元素常用属性及事件的含义。实验七 用模板技术制作简单网站实验目的:实验内容:1. 用Dreamweaver较复杂网页。2. 网页用表格布局。3. 网页中要求包括超链接、图片。4. 注意文字的排版，以及文字与图片的混排。5. 用模板技术制作网站中公共部分。实验八 用CSS控制网页文本和图像实验目的:实验内容:1. CSS样式的创建。2. CSS样式的管理。3. 不同CSS选择器的使用。4. 用CSS控制网页元素。5. 常用CSS属性的使用。实验要求:实验九 用CSS设置链接与导航菜单实验目的:实验内容:1. 用CSS控制超链接效果。2. 用CSS样式控制、标签。3. float属性的使用，导航菜单的制作。实验十 用CSS设置表格和表单样式实验目的:实验内容:1. 用CSS控制表格效果。2. 用CSS样式控制表单。实验十一 用CSS+DIV设计网页综合实例一实验目的:实验内容:1. 参考样张用CSS+DIV制作网站实例。2. CSS中层的浮动。3. CSS中背景图片的应用。4. CSS+DIV布局网页的基本方法。实验十二 用CSS+DIV设计网页综合实例二实验目的:实验内容:1. 参考样张用CSS+DIV制作网站实例。2. 通过综合实例掌握CSS中导航的制作。3. 通过综合实例掌握层的浮动，各层之间的位置关系。4. CSS边框的制作。5. CSS+DIV布局网页的基