Web前端开发技术实验与实践——HTML、CSS、JavaScript

上篇 实验(课内练习)

第一部分 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！

程序代码清单

实验十一 JavaScript事件分析

项目1 表单数据验证

项目2 鼠标事件处理程序

程序代码清单

实验十二 DOM与BOM

项目1 福利彩票投注助手

项目2 双向选择列表框

项目3 Web服务器配置与信息发布(Easyphp)

程序代码清单

第四部分 Web前端开发工具

实验十三 EditPlus

项目1 EditPlus操作实验

项目2 使用EditPlus软件编写HTML、CSS、JavaScript程序

项目3 编写自定义HTML模板

实验十四 TextPad

项目1 TextPad操作实验

项目2 用TextPad软件编写HTML、CSS、JavaScript程序

实验十五 TopStyle

项目1 TopStyle操作实验

项目2 使用TopStyle编写HTML、CSS、JavaScript程序

实验十六 CSS3 Menu

项目1 CSS3 Menu操作实验

项目2 编写嵌入CSS3 Menu菜单的Web应用程序

实验十七 Sothink Tree Menu

项目1 Sothink Tree Menu操作实验

项目2 使用Sothink Tree Menu编写Web网页菜单

实验十八 ColorImpact

项目1 ColorImpact操作实验

项目2 网页配色

下篇 实践(课程设计)

第五部分 网站设计

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

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

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

课题3 推荐及自选网站

参考文献