Web前端开发技术实验与实践

上篇 实验（课内练习）

第一部分 HTML基础

实验一 Web前端开发环境配置与HTML基础

项目1 Web前端开发环境配置

项目2 多种URL访问方式

项目3 使用NotePad编写网页

项目4 用EditPlus自定义HTML模板

项目5 body标记属性使用

项目6 HTML、CSS、JavaScript三合一综合练习

程序代码清单

实验二 格式化文本——文本、段落格式化与列表

项目1 文字与段落格式化

项目2 利用无序列表制作新闻列表

项目3 利用有序列表制作《大型分析仪器管理办法》

项目4 利用自定义列表制作章节目录

程序代码清单

实验三 格式化文本——超链接与多媒体应用

项目1 网站导航的超链接设计

项目2 利用书签链接制作帮助文档

项目3 有背景音乐的电子相册制作

项目4 制作多媒体文件网页

程序代码清单

第二部分 页面布局技术

实验四 CSS+DIV基础

项目1 CSS四种样式的引用

项目2 CSS+DIV页面布局设计

程序代码清单

实验五 CSS+DIV高级应用

项目1 油画欣赏页面设计

项目2 CERNET华东北地区年会网站仿真构建

程序代码清单

实验六 表格

项目1 制作成绩登记表

项目2 制作产品宣传页面

项目3 简化版“江苏教育电子政务网站

程序代码清单

实验七 框架

项目1 简易网站后台管理页面

项目2 浮动框架制作“2011年全国教育技术理论与实践作品大赛网”

程序代码清单

实验八 表单

项目1 留言板设计——“中国科学技术协会科技工作者建言”

项目2 大学生暑期社会实践调查问卷

程序代码清单

第三部分 JavaScript基础

实验九 JavaScript基础

项目1 改变网页字号大小

项目2 计算圆的面积

项目3 消息对话框使用

项目4 系统内部函数使用

程序代码清单

实验十 JavaScript程序结构

项目1 成绩百分制转换为五级制

项目2 计算∑N!

程序代码清单

项目2 网页配色

下篇 实践（课程设计）

第五部分 网站设计

“Web前端开发技术”课程设计

课题1 “Web前端开发技术”实践教学网站

课题2 2011CERNET华东北地区年会网站

课题3 推荐及自选网站

参考文献

本书是在作者从事教学研究和“Web前端开发技术”课程教学的基础上，为了满足“Web前端开发技术”课程实践教学的需要而编写的实验与实践教程。本书分为上、下两篇。上篇为实验（课内实验），包括HTML基础（Web前端开发环境配置、HTML基本语法、文本格式化、列表、超链接、多媒体应用）、页面布局技术（CSS+DIV、表格、框架、表单）、JavaScript基础（JavaScript基本语法、程序结构、事件分析、DOM与BOM）、Web前端开发工具4个部分，内含12次实验36个实验项目。下篇为实践（课程设计），包括高校网络课程网站、商业网站设计与开发2个典型案例和其他自选案例的介绍。本书内容分布结构合理，实验项目设计由浅入深、循序渐进，实验步骤思路清晰、指导深入，实验项目切合实际，真实性强。可作为高等学校本科软件工程、计算机科学与技术以及相关专业“Web前端开发技术基础”课程的实验与实践教材，也可作为高等学校相关专业的“网页设计与开发”、“网站建设/网页制作”等相关课程的实验与实践教材，同时也可作为从事Web开发相关工作的工程技术人员的参考书。

教学目标明确，注重理论与实践的结合；
教学方法灵活，培养学生自主学习的能力；
教学内容先进，强调计算机在各专业中的应用；
教学模式完善，提供配套的教学资源解决方案。