网页样式与布局设计课程教学大纲.docx
网页样式与布局设计课程教学大纲一、课程说明1 .课程代码:ZJ12040152 .课程类别:专业基础能力课3 .适应专业及课程性质网络与新媒体专业必修4 .课程目的随着互联网的快速发展,电子商务、视频点播、即时通信、搜索、博客等已融入了人 们的工作和生活。在这种环境下如何创建优秀网站是所有互联网从业者面临的挑战。通过 本课程学习,使学生本掌握网站前端静态网页设计流行技术,熟悉Web2.0技术规范,使学 生精通HTML源代码,能够利用Adobe Dreamweaver软件平台,运用DIV+CSS技术制作美 观、标准、跨浏览器的网页。5 .学时与学分总学时为64学时,其中理论32学时,实践32学时,学分为3.0学分6 .建议先修课程网站设计与网页设计基础二、课程教学基本内容及要求第1章 怎样开发设计网站计划学时:4基本要求:(1)掌握网站开发设计需要什么技术(2)掌握一个简单的网页需要包含什么教学重点及难点:(1)网站开发设计需要什么技术基本内容:(1)网站开发设计需要什么技术一个简单的网页需要包含什么第2章HTML入门基础计划学时:4基本要求:(1)掌握文本标签及其属性的使用(2)掌握段落标签及其属性的使用(3)掌握超链接标签及其属性的使用(4)掌握图像标签及其属性的使用(5)掌握表格标签及其属性的使用(6)掌握其它HTML标签及其属性的使用教学重点及难点:(1)各种常用HTML标签的熟练使用基本内容:(1)文本标签及其属性(2)段落标签及其属性(3)超链接标签及其属性(4)图像标签及其属性(5)表格标签及其属性(6)其它HTML标签及其属性第3章CSS样式设计基础计划学时:8基本要求:(1)掌握CSS基本语法及添加CSS的方法(2)掌握CSS选择器及其使用(3)掌握CSS属性和属性值教学重点及难点:(1) CSS选择器及其使用基本内容:(2) CSS基本语法(2)添加CSS的方法(2) CSS选择器概述(4)类选择器、ID选择器、标签选择器等(5) CSS属性和属性值第4章 使用CSS设置文本和段落样式计划学时:4基本要求:(1)掌握字体属性的设置(2)掌握段落属性的设置教学重点及难点:(1)字体属性的设置(2)段落属性的设置基本内容:(1)字体属性的设置(2)段落属性的设置(3)实例应用第5章 使用CSS设置图片和背景样式计划学时:8基本要求:(1)掌握图片样式设置(2)掌握背景样式设置教学重点及难点:(1)图片样式设置(2)背景样式设置基本内容:(1)定义图片边框(2)文字环绕图片(3)设置页面背景颜色(4)定义背景图片及其重复方式(5)实例应用第6章 使用CSS控制列表样式计划学时:8基本要求:(1)掌握有序列表样式的设置(2)掌握无序列表样式的设置教学重点及难点:(1)有序列表样式的设置(2)无序列表样式的设置基本内容:(1)有序列表样式的设置(2)无序列表样式的设置(3)实例应用第7章 使用CSS设计表格样式计划学时:8基本要求:(1)掌握创建表格的方法(2)掌握表格基本属性的设置(3)掌握表格样式的设置教学重点及难点:(1)表格样式的设置基本内容:(1)创建表格的方法(2)表格基本属性的设置(3)表格样式的设置(4)实例应用第8章 使用CSS定义链接样式计划学时:8基本要求:(1)掌握光标样式的设置(2)掌握下划线样式的设置(3)掌握四种访问状态样式的设置 教学重点及难点:(1)四种访问状态样式的设置基本内容:(1)光标样式的设置(2)下划线样式的设置(3)四种访问状态样式的设置(4)实例应用第9章CSS中的滤镜计划学时:4基本要求:(6) 了解CSS中滤镜的原理(2)熟悉各种CSS滤镜样式的设计 教学重点及难点:(1)各种CSS滤镜的设置基本内容:(7) CSS中滤镜的原理(2)各种CSS滤镜样式的设计第10章Div+CSS布局入门计划学时:4基本要求:(1)认识盒模型(2)掌握外边距的设置(3)掌握内边距的设置(4)掌握边框的设置(5)理解CSS布局理念教学重点及难点:(1)理解css布局理念基本内容:(1)认识盒模型(2)外边距的设置(3)内边距的设置(4)边框的设置(5) CSS布局基本方法第11章用CSS定位控制网页布局计划学时:4基本要求:(1)掌握position定位的方法(2)掌握浮动定位的方法(3)掌握定位层叠的方法(4)熟悉常见布局类型教学重点及难点:(8) position定位的方法(2)浮动定位的方法(3)常见布局类型基本内容:(9) position定位的方法(2)浮动定位的方法(3)定位层叠的方法(4)常见布局类型三、课程学时分配本课程计划64学时,其中理论教学32学时,实践教学32学时。课程主要内容和学时分配见课程学时分配表。表1课程学时分配表教学环节课程内容理论教学课内实践小计第1章 怎样开发设计网站224第2章HTML入门基础224第3章CSS样式设计基础448第4章 使用CSS设置文本和段落样式224第5章 使用CSS设置图片和背景样式448第6章 使用CSS控制列表样式448第7章 使用CSS设计表格样式448第8章 使用CSS定义链接样式448第9章CSS中的滤镜224第10章Div+CSS布局入门224第11章 用CSS定位控制网页布局224总计323264表2课内实践学时分配表序 号实践项目名称学 时实践内容及目的实践方式备注实验、课堂讨论、 案例分析、课程小 论文、专业技法等1CSS样式设计基 础8L 了解网站开发设计需要什么; 2、掌握各种HTML标签的使用;3、掌握CSS选择器的使用; 4、熟悉CSS属性和属性值实验2用CSS控制HTML兀素样式201、能使用CSS设置文本和段落样式; 2、能使用CSS设置图片和背景样式; 3、能使用CSS控制列表样式; 4、能使用CSS设计表格样式; 5、能使用CSS定义链接样式; 6、熟悉CSS中的滤镜的使用方法实验3用CSS定位控制 网页布局41s掌握DIV+CSS布局的基本方法; 2、掌握CSS的position定位、浮动 定位、定位层叠等技巧的使用;3、综合运用Div+Css网页样式与布 局技巧设计一套网页的模板,包含首 页、列表页、内容页实验四、考核及成绩评定考核方式:考查成绩评定:(1)平时成绩占50% ,形式有:考勤、实验、作业等;(2)期末考核成绩占50%,考核形式为:作品考查。五、推荐教材、参考书目与推荐网站推荐教材:(1) Div+CSS网页样式与布局从入门到精通,刘西杰等主编人民邮电出版社,2015年 参考书目:(1)精通DIV+CSS网页样式与布局(第二版),何丽等主编,清华大学出版社,2014CSS+DIV网页布局技术详解,邢太北编著,清华大学出版社.2014年制订人:审核人:批准人:年 月 日