《1_firstlesson.ppt

WEB技术基础 (HTML+CSS+JS) 主讲：吕永国 lv.yg@ 缘 课程信息 课程代码：CS1637 课程名称：Web技术基础 学分：4 学时：60 授课对象：08软件类（专科） 先修课程：《网页设计与制作》 同修课程： 《面向对象编程语言》 课程介绍 本课程是一门客户端浏览器编程技术,完成本课程的学习后,学生将掌握如何使用HTML+CSS+JS代码编写界面，实现页面的动态效果及页面与用户的交互操作功能. 在B/S系统中，课程技术所处地位 本课程为本院软件类专业开设的专业核心课之一，相关专业学生的就业方向有： 本课程应解决的能力： 理论知识：掌握当前主流的企业应用开发技术（Web2.0），能熟练使用HTML+CSS+JS技术在客户端浏览器编程。 实践能力：能独立完成客户端浏览器页面的实际开发，实现静态页面的排版，动态效果与人机交互。 课程知识结构： 案例抽取知识依据分析（基础） 案例知识点分析（基础案例） 案例分析： 要实现此页面，分析相关的技术（讲述的课程内容）： 1.使用html元素显示页面数据 2.使用CSS进行排版； 3.使用CSS进行布局定位； 案例抽取知识依据分析（提高） 案例抽取知识依据分析（提高） 加深对知识的理解与使用： 1）布局加深：布局分了上下左右 四个区域后，每个区域又继续细分 （例如：上面的区域又分成左右两块。也就是布局的进一步嵌套。） 2）由于嵌套加多，需要学生把标签使用通过语义区分 3）动态效果使用增加： （例如：菜单中，鼠标划过，二级菜单出现，其中牵涉到 定位，鼠标坐标判定的知识） JS教学思路： 界面某一元素操作 – 捕获 ? 处理 使用这思路，可以做出流行大部分页面效果， 例如： 1）点击左面菜单，二级子菜单的打开与关闭 2）鼠标移动过的元素背景跟着改变等 根据一个页面需要的知识内容，给同学们进行讲解，每个知识点使用简单例子讲述。 课程的能力目标： 能独立完成客户端浏览器页面的实际开发，实现静态页面的排版，动态效果与人机交互。 1）开发上述的基础案例：有页面数据，排版，布局。 2）开发上述的提高案例：有JS控制页面数据，实现页面动态效果与人机交互。 WEB技术基础 教学进度设计（简说）： 1）前4周：将完成xhtml标签库显示数据的教学（注：标签排版属性删除） 2）5-10周：将完成CSS控制XHTML教学，实现CSS排版 3）11-14周：将完成JS控制XHTML教学，实现动态效果与人机交互。 4）15-16周：综合考查作业 WEB技术基础 能力训练项目设计（简说）： 1）学生可以使用HTML标签显示页面内容 2）学生使用CSS对HTML进行排版，实现一个商业网站静态页面。 3）继续深化第二份作业，用JS实现页面动态效果与人机交互功能。 成绩评定： 平时出勤：20% （包括课堂，六次不出席者取消考试资格） 平时作业：30% （HTML显示数据，css布局页面实现，JS例子，综合模版开发，面对面考核） 考查大作业：50% 教学资源： 1）本系网站：--Web技术基础 课程子网 （有教师课件，作业，案例，知识库，网上答疑等相关栏目） 2）图书馆 3）教材 4）答疑时间：星期三下午 教材及参考书： 1、教材，《HTML+CSS+JAVAScript基础教程》耿祥义编著 电子工业出版社 ISBN 7-121-00959-5 2、参考书,《深入浅出HTML》（美）舒尔茨，（美）库克　著，谢延晟　译人民邮电出版社 2005年2月 ISBN: 9787115177360 3、参考书，《HTML XHTML CSS 基础教程》（美）卡斯特罗 著，陈剑瓯 等译，人民邮电出版社。ISBN: 9787115162083　 4、参考书《CSS 基础教程》（英）柯林森　著，刘志忠　等译，人民邮电出版社2002年9月第1版　ISBN：9787115164629　 5、参考书《JavaScript 基础教程（第6版）》（美）内格里诺，（美）史密斯　著，陈剑瓯　等译，人民邮电出版社2002年9月　ISBN：9787115163592 6、 参考书，《精通CSS：高级Web标准解决方案——图灵程序设计丛书》，（英）巴德 著，陈剑瓯 译，人民邮电出版社2006-11-1第1版 ISBN：9787115153166 交互? 请同学们发表自己的见意: 1)对该课程有什么期待与要求 2)课程内容组织与安排 3)考核方式 作业： 软件安装： Adobe Dreameaver CS3安装 Firefox 浏览器的应用插件： web developer venkman