HTML5+CSS3 网站设计基础教程》课程教学大纲课程英文名称）课程编号：201601210011学 分：5 学分学 时：76 学时 （其中：讲课学时：47 学时 上机学时：26 学时）先修课程：计算机基础、计算机网络、计算机应用后续课程：UI设计、JavaScript网页特效适用专业：信息技术及其计算机相关专业开课部门：计算机系一、课程的性质与目标《HTML5+CSS3网站设计基础教程》是面向计算机相关专业的一门专业基础课，涉及 网页基础、 HTML 标记、 CSS 样式、网页布局、变形与动画等内容，通过本课程的学习， 学生能够了解网页 web 发展历史及其未来方向，熟悉网页设计流程、掌握网络中常见的网 页布局效果及变形和动画效果，学会制作各种企业、门户、电商类网站二、课程设计理念与思路课程设计理念：高职教育的集中实践教学环节需明确必要的理论知识的生化与知识层面 的拓展，不能局限于单纯的技能训练单纯的技能训练不是提高高等职业教育的理想课程 以能力的培养为重点，以就业为导向，培养学生具备职业岗位所需的职业能力，职业生涯发 展所需的能力和终身学习的能力，实现一站式教学理念课程设计思路：基于工作过程开发课程内容，以行动为导向进行教学内容设计，以学生 为主体，以案例（项目）实训为手段，设计除理论学习与技能掌握相融合的课程内容体系。
教学整体设计“以职业技能培养为目标，以案例（项目）任务实现为载体、理论学习与时间 操作相结合”三、教学条件要求开发工具：Dreamweaver CS6、课程的主要内容及基本要求第一章 初识 HTML5学习单元初识HTML5学时 10学时学习目标1. 了解HTML5发展历程2. 理解HTML5浏览器支持情况3. 熟悉HTML5基本语法，掌握HTML5语法新特性4. 掌握HTML5相关标记及属性，能够制作简单的网页页面学习内容知识点了解掌握重点难点HTML5发展历史VHTML5的优势VHTML5浏览器支持情况V创建第一个HTML5页面VHTML5文档基本格式VHTML5语法VHTML标记V标记的属性VHTML5文档头部相关标 记V标题和段落标记V文本格式化标记V特殊字符标记V常用图像格式V图像标记vimg/>V绝对路径和相对路径V创建超链接V锚点链接VV第二章 HTML5 页面元素及属性学习单元HTML5页面兀素及属性学时6学时学习目标1. 掌握结构兀素的使用，可以使页面分区更明确2. 理解分组元素的使用，能够建立简单的标题组3. 掌握页面交互兀素的使用，能够实现简单的交互效果4. 理解文本层次语义兀素，能够在页面中突出所标记的文本内容。
5. 掌握全局属性的应用，能够使页面兀素实现相应的操作学习内容知识点了解掌握重点难点ul兀素Vol兀素Vdl兀素V列表的嵌套应用VVheader兀素Vnav兀糸Varticle 兀素Vsection 兀素Vfooter兀素Vfigure 和 figcaption 兀素Vhgroup兀素Vdetails 和 summary 兀素Vprogress 儿糸Vmeter兀素Vtime兀素Vmark兀素Vcite兀素Vdraggable 属性Vhidden属性Vspellcheck 属性Vcontenteditable 属性V第三章 CSS3 入门学习单元CSS3入门学时 8学时学习目标1. 了解CSS3的发展历史以及主流浏览2. 掌握CSS基础选择器，能够运用CS3. 熟悉CSS文本样式属性，能够运用彳4. 理解CSS优先级，能够区分复合选扌;器的支持情况S选择器定义标记样式 相应的属性定义文本样式 择器权重的大小学习内容知识点了解掌握重点难点CSS3概述VCSS3发展历史VCSS3浏览器支持情况VCSS样式规则V引入CSS样式表VCSS基础选择器V字体样式属性VV文本外观属性VVCSS层叠性和继承性VCSS优先级VV第四章 CSS3 选择器学习单元CSS3选择器学时 8学时学习目标1. 掌握CSS3中新增加的属性选择器，能够运用属性选择器为页面中的兀素 添加样式。
2. 理解关系选择器的用法，能够准确判断元素与元素间的关系3. 掌握常用的结构化伪类选择器，能够为相冋名称的兀素定义不冋样式4. 掌握伪兀素选择器的使用，能够在页面中插入所需要的文字或图片内容5. 掌握CSS伪类，会使用CSS伪类实现超链接特效学习内容知识点了解掌握重点难点E[attA=value]属性选择器VE[att$=value ]属性选择器VE[att*=value ]属性选择器V子代选择器（＞）V兄弟选择器（+、~）V:root选择器V:not选择器V:only-child 选择器V:first-child 和:last-child 选 择器V:nth-child(n)和:nth-last-child(n)选择器VV:nth-of-type(n)和:nth-last-of-type(n)选择 器V:empty选择器V:target选择器V:before选择器VV:after选择器VV链接伪类V第五章 CSS 盒子模型学习单元CSS盒子模型学时 8学时学习目标1. 掌握盒子的相关属性，能够制作常见的盒子模型效果2. 掌握背景属性的设置方法，能够设置背景颜色和图像3. 理解渐变属性的原理，能够设置渐变背景。
4. 熟悉CSS控制列表样式的方式，能够运用背景图像定义列表项目符号学习内容知识点了解掌握重点难点认识盒子模型V
标记V盒子的宽与高V边框属性V边距属性Vbox-shadow 属性VVbox-sizing 属性V设置背景颜色V设置背景图像V背景与图片不透明度的设 置V设置背景图像平铺V设置背景图像的位置V设置背景图像固定V设置背景图像的大小V设置背景的显示区域V设置背景图像的裁剪区域V设置多重背景图像V背景复合属性V线性渐变V径向渐变V重复渐变V第六章 浮动与定位学习单元浮动与定位学时 8学时学习目标1. 理解兀素的浮动，能够为兀素设置浮动样式2. 熟悉清除浮动的方法，可以使用不同方法清除浮动3. 掌握兀素的定位，能够为兀素设置常见的定位模式学习内容知识点了解掌握重点难点兀素的浮动属性floatVV清除浮动Voverflow 属性V兀素的定位属性V静态定位staticV相对定位relativeVV绝对定位absoluteVV固定定位fixedVz-index层叠等级属性V兀素的类型Vvspan ＞标记V兀素的转换V第七章 表单的应用学习单元表单的应用学时8学时学习目标1. 了解表单功能，能够快速创建表单。
2. 掌握表单相关兀素，能够准确定义不冋的表单控件3. 掌握表单样式的控制，能够美化表单界面学习内容知识点了解掌握重点难点表单的构成V创建表单V表单属性VInput兀素的type属性VVInput兀素的其他属性Vtextarea 兀素Vselect兀素Vdatalist 兀素Vkeygen兀素Voutput兀素VCSS控制表单样式VV第八章 多媒体技术学习单元多媒体技术学时 6学时学习目标1. 熟悉HTML5多媒体特性2. 了解HTML5支持的音频和视频格式3. 掌握HTML5中视频的相关属性，能够在HTML5页面中添加视频文件4. 掌握HTML5中音频的相关属性，能够在HTML5页面中添加音频文件5. 了解HTML5中视频、音频的一些常见操作，并能够应用到网页制作中学习内容知识点了解掌握重点难点HTML5多媒体的特性V视频和音频编解码器V多媒体的格式V支持视频和音频的浏览器V在HTML5中嵌入视频VV在HTML5中嵌入音频VV音视频中的source兀素V调用网页多媒体文件VCSS控制视频的宽高V视频和音频的方法和事件VHTML5音视频发展趋势V第九章 CSS3 高级应用学习单元CSS3高级应用学时 8学时学习目标1. 理解过渡属性，能够控制过渡时间、动画快慢等常见过渡效果。
2. 掌握CSS3中的变形属性，能够制作2D转换、3D转换效果3. 掌握CSS3中的动画，能够熟练制作网页中常见的动画效果学习内容知识点 了解掌握 重点 难点transition-property 属性Vtransition-duration 属性Vtr。