教学大纲 学时：72理论36实践：36学分：4适用专业：计算机相关专业制定人：秋彦芳 一、课程的性质与目标 《HTML5》是面向计算机相关专业的一门专业基出课，涉及网页基础、HTML标记CSS样式、网页布局、变 形与动画等内容，通过本课程的学习，学生能够了解网页wb发展历史及其未来方向，熟恶网页设计流程、掌 握网络中常见的网页布局效果及变形和动画效果，学会制作各种企业、门户、电商类网站。 二、课程的教学目的 通过本课程的学习，学生能够掌握基本的HTML5+CSS3网页布局，最终可以独立开发出高颜值、多特效的前 PC网页 三、教学内容，教学要求及教学重点和难点 第一章初识HTML5 (理论教学：3学时实践：3学时) 1、讲授内容 html5概述、html5基础、文本控制标记、图像标记、超链接标记. 2、教学要求和重点内容 (1)了解HTML5发展历程 (2)理解HTML5浏览器支持情况。 (3)熟悉HTML5基本语法，掌握HTML5语法新特性。（重点） (4)掌握HTML5相关标记及属性，能够制作简单的网页页面。（重点） 3、难点及处理方法：上机操作完成任务，锚点链接有用法。 第二章html5页面元素及属性 (理论教学：3学时实践：3学时) 1、讲授内容 列表元素、结构元素、分组元素、页面交互元素、文本层次语义元素、全局属性， 2、教学要求和重点内容 (1)掌握结构元素的使用，可以使页面分区更明确。（重点） (2)理解分组元素的使用，能够建立简单的标题组。（重点） (3)掌握页面交互元素的使用，能够实现简单的交互效果。 (④)理解文本层次语义元素，能够在页面中突出所标记的文本内容。 (⑤)掌握全局属性的应用，能够使页面元素实现相应的操作。 3、难点及处理方法：上机操作完成任务，列表的嵌套应用，注意区别无序序列还是有序序列，特别注意在书写 过程中，要能体现各层级的嵌套关系。 第三章CSS入门
教学大纲 学时：72 理论:36 实践:36 学分：4 适用专业：计算机相关专业 制定人：秋彦芳 一、课程的性质与目标 《HTML5》是面向计算机相关专业的一门专业基础课，涉及网页基础、HTML标记、CSS样式、网页布局、变 形与动画等内容，通过本课程的学习，学生能够了解网页web发展历史及其未来方向，熟悉网页设计流程、掌 握网络中常见的网页布局效果及变形和动画效果，学会制作各种企业、门户、电商类网站。 二、课程的教学目的 通过本课程的学习，学生能够掌握基本的HTML5+CSS3网页布局，最终可以独立开发出高颜值、多特效的前 PC网页。 三、教学内容，教学要求及教学重点和难点 第一章 初识HTML5 （理论教学：3学时 实践：3学时） 1、讲授内容 html5概述、html5基础、文本控制标记、图像标记、超链接标记。 2、教学要求和重点内容 (1) 了解HTML5发展历程。 (2) 理解HTML5浏览器支持情况。 (3) 熟悉HTML5基本语法,掌握HTML5语法新特性。（重点） (4) 掌握HTML5相关标记及属性，能够制作简单的网页页面。（重点） 3、难点及处理方法：上机操作完成任务，锚点链接有用法。 第二章 html5页面元素及属性 （理论教学：3学时 实践：3学时） 1、讲授内容 列表元素、结构元素、分组元素、页面交互元素、文本层次语义元素、全局属性。 2、教学要求和重点内容 (1) 掌握结构元素的使用，可以使页面分区更明确。（重点） (2) 理解分组元素的使用，能够建立简单的标题组。（重点） (3) 掌握页面交互元素的使用，能够实现简单的交互效果。 (4) 理解文本层次语义元素，能够在页面中突出所标记的文本内容。 (5) 掌握全局属性的应用，能够使页面元素实现相应的操作。 3、难点及处理方法：上机操作完成任务，列表的嵌套应用，注意区别无序序列还是有序序列，特别注意在书写 过程中，要能体现各层级的嵌套关系。 第三章 CSS入门
(理论教学：2学时实践：2学时 1、讲授内容 CSS简介、CSS核心基础、文本样式属性、CSS高级特性 2、教学要求和重点内容 (1)了解CSS3的发展历史以及主流浏览器的支持情况。 (2)掌握CSS基础选择器，能够运用CSS选择器定义标记样式 (3)熟悉CSS文本样式属性，能够运用相应的属性定义文本样式。（重点） (4)理解CSS优先级，能够区分复合选择器权重的大小。（重点） 3、难点及处理方法：上机操作完成任务，CSS优先级，通过大量的练习，能熟练掌握。 第四章CSS选择器 (理论教学：4学时实践：4学时) 1、讲授内容 属性选择器、关系选择器、结构化伪类选择器、伪元素选择器、链接伪类。 2、教学要求和重点内容 (1)掌握CSS3中新增加的属性选择器，能够运用属性选择器为页面中的元素添加样式。 (2)理解关系选择器的用法，能够准确判断元素与元素间的关系。 (3)掌握常用的结构化伪类选择器，能够为相同名称的元素定义不同样式。（重点） (4)掌握伪元素选择器的使用，能够在页面中插入所需要的文字或图片内容。（重点） (5⑤)掌握CSS伪类，会使用CSS伪类实现超链接特效。 3、难点及处理方法：上机操作完成狂务，nth-child(n)和：nth-ast-child(n)选择器、:beforei选择器、:afteri选 择器选择器，结合相应素材，对同一素材添加不同的选择器，对结果进行比较，总结各类选择器的用法。 第五章盒子模型 (理论教学：4学时实践：4学时) 1、讲授内容 盒子模型概述、盒子模型相关属性、背景属性、c55渐变属性。 2、教学要求和重点内容 (1)掌握盒子的相关属性，能够制作常见的盒子模型效果知识。（重点） (2)掌握背景属性的设置方法，能够设置背景颜色和图像。（重点） (3)理解渐变属性的原理，能够设置渐变背景。（重点） (4)熟悉CSS控制列表样式的方式，能够运用背景图像定义列表项目符号。 3、难点及处理方法：上机操作完成任务，对盒子模型添加box~shadow属性，如何改变阴影的投射方向以及添 加多重阴影效果。 第六章浮动与定位 (理论教学：4学时实践：4学时， 1、讲授内容 元素的浮动、overflow属性、元素的定位、元素的类型与转换。 2、教学要求和重点内容
（理论教学：2学时 实践：2学时） 1、讲授内容 CSS简介、CSS核心基础、文本样式属性、CSS高级特性。 2、教学要求和重点内容 (1) 了解CSS3的发展历史以及主流浏览器的支持情况。 (2) 掌握CSS基础选择器，能够运用CSS选择器定义标记样式。 (3) 熟悉CSS文本样式属性，能够运用相应的属性定义文本样式。（重点） (4) 理解CSS优先级，能够区分复合选择器权重的大小。（重点） 3、难点及处理方法：上机操作完成任务，CSS优先级，通过大量的练习，能熟练掌握。 第四章 CSS选择器 （理论教学：4学时 实践：4学时） 1、讲授内容 属性选择器、关系选择器、结构化伪类选择器、伪元素选择器、链接伪类。 2、教学要求和重点内容 (1)掌握CSS3中新增加的属性选择器，能够运用属性选择器为页面中的元素添加样式。 (2)理解关系选择器的用法，能够准确判断元素与元素间的关系。 (3)掌握常用的结构化伪类选择器，能够为相同名称的元素定义不同样式。（重点） (4)掌握伪元素选择器的使用，能够在页面中插入所需要的文字或图片内容。（重点） (5) 掌握CSS伪类，会使用CSS伪类实现超链接特效。 3、难点及处理方法：上机操作完成任务，:nth-child(n)和:nth-last-child(n)选择器、:before选择器、:after选 择器选择器，结合相应素材，对同一素材添加不同的选择器，对结果进行比较，总结各类选择器的用法。 第五章 盒子模型 （理论教学：4学时 实践：4学时） 1、讲授内容 盒子模型概述、盒子模型相关属性、背景属性、css渐变属性。 2、教学要求和重点内容 (1) 掌握盒子的相关属性，能够制作常见的盒子模型效果知识。（重点） (2) 掌握背景属性的设置方法，能够设置背景颜色和图像。（重点） (3) 理解渐变属性的原理，能够设置渐变背景。（重点） (4) 熟悉CSS控制列表样式的方式，能够运用背景图像定义列表项目符号。 3、难点及处理方法：上机操作完成任务，对盒子模型添加box-shadow属性，如何改变阴影的投射方向以及添 加多重阴影效果。 第六章 浮动与定位 （理论教学：4学时 实践：4学时） 1、讲授内容 元素的浮动、overflow属性、元素的定位、元素的类型与转换。 2、教学要求和重点内容
(1)理解元素的浮动，能够为元素设置浮动样式类型。（重点） (②)熟悉清除浮动的方法，可以使用不同方法清除浮动。 (3)掌握元素的定位，能够为元素设置常见的定位模式。（重点） 3、难点及处理方法 上机操作完成任务，使用浮动和定位对顷面重新排版。 第七章表单的应用 (理论教学：4学时实践：4学时) 1、讲授内容 认识表单、表单属性、input元素及属性、其他表单属性、CSS控制表单样式.。 2、教学要求和重点内容 ()了解表单功能，能够快速创建表单。 (2)掌握表单相关元素，能够准确定义不同的表单控件。（重点） (3)掌握表单样式的控制，能够美化表单界面。（重点） 3、难点及处理方法： 上机操作完成任务，创健表单，输入Input元素的ype属性、并设置CSS控制表单样式。 第八章多媒体技术 (理论教学：2学时实践：2学时) 1、讲授内容 html5多煤体特性、多煤体的支持条件、嵌入视频和音频、css控制视频的宽高、视频和音频的方法和事件、 html5音、视频发展趋势. 2、教学要求和重点内容 (1)熟悉HTML5多媒体特性 (2)了解HTML5支持的音频和视频格式。 (3)掌握HTML5中视频的相关属性，能够在HTML5页面中添加视频文件.（重点） (4掌握HTML5中音频的相关属性，能够在HTML5页面中添加音频文件。（重点） (⑤)了解HTML5中视频、音频的一些常见操作，并能够应用到网页制作中. 3、难点及处理方法： 上机操作完成任务，注意通过video元素添加宽高的方式给视频预留一定的空间。 第九章CSS3高级应用 (理论教学：5学时实践：5学时) 1、讲授内容 过渡、变形、动画 2、教学要求和重点内容 ()理解过渡属性，能够控制过渡时间、动画快慢等常见过渡效果。 (2)掌握CSS3中的变形属性，能够制作2D转换、3D转换效果。（重点） (3)掌握CSS3中的动画，能够熟练制作网页中常见的动画效果。（重点） 3、难点及处理方法：
(1) 理解元素的浮动，能够为元素设置浮动样式类型。（重点） (2) 熟悉清除浮动的方法，可以使用不同方法清除浮动。 (3) 掌握元素的定位，能够为元素设置常见的定位模式。（重点） 3、难点及处理方法： 上机操作完成任务，使用浮动和定位对页面重新排版。 第七章 表单的应用 （理论教学：4学时 实践：4学时） 1、讲授内容 认识表单、表单属性、input元素及属性、其他表单属性、CSS控制表单样式。 2、教学要求和重点内容 (1) 了解表单功能，能够快速创建表单。 (2) 掌握表单相关元素，能够准确定义不同的表单控件。（重点） (3) 掌握表单样式的控制，能够美化表单界面。（重点） 3、难点及处理方法： 上机操作完成任务，创建表单，输入Input元素的type属性、并设置CSS控制表单样式。 第八章 多媒体技术 （理论教学：2学时 实践：2学时） 1、讲授内容 html5多媒体特性、多媒体的支持条件、嵌入视频和音频、css控制视频的宽高、视频和音频的方法和事件、 html5音、视频发展趋势。 2、教学要求和重点内容 (1) 熟悉HTML5多媒体特性。 (2) 了解HTML5支持的音频和视频格式。 (3) 掌握HTML5中视频的相关属性，能够在HTML5页面中添加视频文件。（重点） (4) 掌握HTML5中音频的相关属性，能够在HTML5页面中添加音频文件。（重点） (5) 了解HTML5中视频、音频的一些常见操作，并能够应用到网页制作中。 3、难点及处理方法： 上机操作完成任务，注意通过video元素添加宽高的方式给视频预留一定的空间。 第九章 CSS3高级应用 （理论教学：5学时 实践：5学时） 1、讲授内容 过渡、变形、动画。 2、教学要求和重点内容 (1) 理解过渡属性，能够控制过渡时间、动画快慢等常见过渡效果。 (2) 掌握CSS3中的变形属性，能够制作2D转换、3D转换效果。（重点） (3) 掌握CSS3中的动画，能够熟练制作网页中常见的动画效果。（重点） 3、难点及处理方法：
上机操作完成任务，在网页中对元素进行移动、缩放、倾斜、旋转，结合这些变形属性，产生更复杂的动画 第十章制作电商网站首页 (理论教学：3学时实践：3学时) 1、讲授内容 准备工作、首页面详细制作。 2、教学要求和重点内容 (1)掌握站点的建立，能够建立规范的创健。 (2)完成首页面的制作，并能够实现简单的CSS3动画效果.（重点） 3、难点及处理方法： 上机操作完成任务，对页面实现网页布局的美化，用cS5为网页添加动态效果。 四、课时分配 序号教学内容 总学时 理论实践 1第一章初识HTML5 6 3 3 2第二章HTML5页面元素及属性 6 3 3 第三章CSS3入门 8 4 4 4第四章CSS3选择器 8 4 4 5 第五章CSS盒子模型 8 4 4 6第六章浮动与定位 e g 4 7 第七章表单的应用 8 A 4 8 第八章多媒体技术 9 第九章CSS3高级应用 10 5 5 10第十章实战开发一制作电商网站首页面 6 五、教材的选用 《HTML5+CSS3网站设计基础教程》作者：传智播客高教产品研发部人民邮电出版社出版时间：2016.03 参考教材 《html5+css3》作者：黑马程序员人民邮电出版社出版时间：2020.04 《html+css3+-javaScript》web前端开发案例教程，作者王浩，人民邮电出版社，出版时间：2020.07
上机操作完成任务，在网页中对元素进行移动、缩放、倾斜、旋转，结合这些变形属性，产生更复杂的动画。 第十章制作电商网站首页 （理论教学：3学时 实践：3学时） 1、讲授内容 准备工作、首页面详细制作。 2、教学要求和重点内容 (1) 掌握站点的建立，能够建立规范的创建。 (2) 完成首页面的制作，并能够实现简单的CSS3动画效果。（重点） 3、难点及处理方法： 上机操作完成任务，对页面实现网页布局的美化，用css为网页添加动态效果。 四、课时分配 序号 教学内容 总学时 理 论 实 践 1 第一章 初识HTML5 6 3 3 2 第二章 HTML5 页面元素及属性 6 3 3 3 第三章 CSS3入门 8 4 4 4 第四章 CSS3选择器 8 4 4 5 第五章 CSS盒子模型 8 4 4 6 第六章 浮动与定位 8 4 4 7 第七章 表单的应用 8 4 4 8 第八章 多媒体技术 4 2 2 9 第九章 CSS3高级应用 10 5 5 10 第十章 实战开发—制作电商网站首页面 6 3 3 五、教材的选用 《HTML5+CSS3网站设计基础教程》 作者：传智播客高教产品研发部 人民邮电出版社 出版时间：2016.03 参考教材 《html5+css3》 作者：黑马程序员 人民邮电出版社 出版时间：2020.04 《html+css3+javaScript》web前端开发案例教程，作者王浩，人民邮电出版社，出版时间：2020.07
