HTML5 CSS3网站设计基础教程第2版教学大纲Word格式.docx
《HTML5 CSS3网站设计基础教程第2版教学大纲Word格式.docx》由会员分享，可在线阅读，更多相关《HTML5 CSS3网站设计基础教程第2版教学大纲Word格式.docx（24页珍藏版）》请在冰豆网上搜索。
教学整体设计“以职业技能培养为目标，以案例（项目）任务实现为载体、理论学习与时间操作相结合”。
开发工具：
DreamweaverCS6
三、课程的主要内容及基本要求
第一章初识HTML5
学习单元
初识HTML5
课时
10课时
学习目标
1.了解HTML5发展历程
2.理解HTML5浏览器支持情况
3.熟悉HTML5基本语法,掌握HTML5语法新特性。
4.掌握HTML5相关标记及属性，能够制作简单的网页页面。
学习内容
知识点
了解
熟悉
掌握
重点
难点
HTML5发展历史及优势
√
HTML5浏览器支持情况
创建第一个HTML5页面
HTML5文档基本格式
HTML5语法
HTML标记
标记的属性
HTML5文档头部相关标记
标题和段落标记
文本格式化标记
特殊字符标记
常用图像格式
图像标记<
img/>
绝对路径和相对路径
创建超链接
锚点链接
阶段案例—制作HTML5百科页面
第二章HTML5页面元素及属性
HTML5页面元素及属性
6课时
1.掌握结构元素的使用，可以使页面分区更明确。
2.理解分组元素的使用，能够建立简单的标题组。
3.掌握页面交互元素的使用，能够实现简单的交互效果。
4.理解文本层次语义元素，能够在页面中突出所标记的文本内容。
5.掌握全局属性的应用，能够使页面元素实现相应的操作。
ul元素
ol元素
dl元素
列表的嵌套应用
header元素
nav元素
article元素
aside
section元素
footer元素
figure和figcaption元素
hgroup元素
details和summary元素
progress元素
meter元素
time元素
mark元素
cite元素
全局属性
阶段案例—制作电影影评网
第三章CSS3入门
CSS3入门
8课时
1.了解CSS3的发展历史以及主流浏览器的支持情况。
2.掌握CSS基础选择器，能够运用CSS选择器定义标记样式。
3.熟悉CSS文本样式属性，能够运用相应的属性定义文本样式。
4.理解CSS优先级，能够区分复合选择器权重的大小。
CSS3简介
CSS样式规则
引入CSS样式表
标记选择器
类选择器
id选择器
通配符选择器
标签指定式选择器
后代选择器
并集选择器
字体样式属性
文本外观属性
CSS层叠性和继承性
CSS优先级
阶段案例—制作服装推广软文
第四章CSS3选择器
CSS3选择器
1.掌握CSS3中新增加的属性选择器，能够运用属性选择器为页面中的元素添加样式。
2.理解关系选择器的用法，能够准确判断元素与元素间的关系。
3.掌握常用的结构化伪类选择器，能够为相同名称的元素定义不同样式。
4.掌握伪元素选择器的使用，能够在页面中插入所需要的文字或图片内容。
5.掌握CSS伪类，会使用CSS伪类实现超链接特效。
E[att^=value]属性选择器
E[att$=value]属性选择器
E[att*=value]属性选择器
子代选择器（>
）
兄弟选择器（+、~）
:
root选择器
not选择器
only-child
选择器
first-child和:
last-child选择器
nth-child（n）和:
nth-last-child（n）选择器
nth-of-type（n）和:
nth-last-of-type（n）选择器
empty选择器
target选择器
before选择器
after选择器
链接伪类
阶段案例—制作网页设计软件列表
第五章CSS盒子模型
CSS盒子模型
1.掌握盒子的相关属性，能够制作常见的盒子模型效果。
2.掌握背景属性的设置方法，能够设置背景颜色和图像。
3.理解渐变属性的原理，能够设置渐变背景。
4.熟悉CSS控制列表样式的方式，能够运用背景图像定义列表项目符号。
认识盒子模型
<
div>
标记
盒子的宽与高
边框属性
边距属性
box-shadow属性
box-sizing属性
设置背景颜色与图像
背景与图片不透明度的设置
设置背景图像平铺与位置
设置背景图像固定方式与大小
设置背景的显示区域与裁剪区域
设置多重背景图像
背景复合属性
线性渐变
径向渐变
重复渐变
阶段案例—制作音乐排行
第六章浮动和定位
浮动和定位
1.理解元素的浮动，能够为元素设置浮动样式。
2.熟悉清除浮动的方法，可以使用不同方法清除浮动。
3.掌握元素的定位，能够为元素设置常见的定位模式。
元素的浮动属性float
清除浮动
overflow属性
元素的定位属性
相对定位relative
绝对定位absolute
静态定位与固定定位
z-index层叠等级属性
元素的类型
span>
元素的转换
阶段案例—制作网页焦点图
第七章表单的应用
表单的应用
1.了解表单功能，能够快速创建表单。
2.掌握表单相关元素，能够准确定义不同的表单控件。
3.掌握表单样式的控制，能够美化表单界面。
表单的构成与创建
表单属性
Input元素的type属性
Input元素的其他属性
textarea元素
select元素
datalist元素
keygen元素
output元素
CSS控制表单样式
阶段案例—制作信息登记表
第八章多媒体技术
多媒体技术
1.熟悉HTML5多媒体特性。
2.了解HTML5支持的音频和视频格式。
3.掌握HTML5中视频的相关属性，能够在HTML5页面中添加视频文件。
4.掌握HTML5中音频的相关属性，能够在HTML5页面中添加音频文件。
5.了解HTML5中视频、音频的一些常见操作，并能够应用到网页制作中。
HTML5多媒体的特性
视频和音频编解码器
多媒体的格式
支持视频和音频的浏览器
在HTML5中嵌入视频
在HTML5中嵌入音频
音视频中的source元素
调用网页多媒体文件
CSS控制视频的宽高
视频和音频的方法和事件
HTML5音视频发展趋势
阶段案例—制作音乐播放界面
第九章CSS3高级应用
CSS3高级应用
1.理解过渡属性，能够控制过渡时间、动画快慢等常见过渡效果。
2.掌握CSS3中的变形属性，能够制作2D转换、3D转换效果。
3.掌握CSS3中的动画，能够熟练制作网页中常见的动画效果。
transition-property属性
transition-duration属性
transition-timing-function属性
transition-delay属性
transition属性
认识transform
2D转换
3D转换
@keyframes
animation-name属性
animation-duration属性
animation-timing-function属性
animation-delay属性
animation-iteration-count属性
animation-direction属性
animation属性
阶段案例—制作工作日天气预报
第十章实战开发—制作电商网站首页面
实战开发—制作电商网站首页面
1.掌握站点的建立，能够建立规范的站点。
2.完成首页面的制作，并能够实现简单的CSS3动画效果。
站点的建立与初始化
效果图分析
页面布局与定义公共样式
制作头部、导航及视频内容
制作内容部分（新品）
制作内容部分（试装）
制作内容部分（评测）
制作脚部（信息注册）及版权信息部分
…………………………………………………………………
四、课时分配
章目
讲课
上机
合计
8
2
10
第二章HTML5
页面元素及属性
5
1
6
8
6
第六章浮动与定位
第八章多媒体技术
4
2
第九章CSS3高级应用
第十章实战开发—制作电商网站首页面
5
58
18
76
五、考核模式与成绩评定办法
本课程为考试课程，期末考试采用百分制的闭卷考试模式。
学生的考试成绩由平时成绩（30%）和期末考试（70%）组成，其中，平时成绩包括出勤（5%）、作业（5%）、上机成绩（20%）。
六、选用教材和主要参考书
本大纲是根据教材《HTML5+CSS3网站设计基础教程》所设计的。
参考书籍：
《网页设计与制作（HTML+CSS）》中国铁道出版社.201408
《HTML+CSS+JavaScript网页制作案例教程》人民邮电出版社.201508
七、大纲说明
本课程的授课模式为：
课堂授课+上机，其中，课堂主要采用多媒体的方式进行授课，并且会通过测试题阶段测试学生的掌握程度；
上机主要是编写程序，要求学生动手完成指定的程序设计或验证。
撰写人：
审定人：
批准人：
执行时间：
升级会员 