HTML5+CSS3网站设计基础教程_教学大纲.pdf

《HTML5+CSS3网站设计基础教程_教学大纲.pdf》由会员分享，可在线阅读，更多相关《HTML5+CSS3网站设计基础教程_教学大纲.pdf（8页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、-HTML5+CSS3HTML5+CSS3 设计根底教程设计根底教程 课程教学大纲课程教学大纲课程英文名称课程 1学分：5 学分学时：76 学时其中：讲课学时：47 学时上机学时：26 学时先修课程先修课程：计算机根底、计算机网络、计算机应用后续课程后续课程：UI 设计、JavaScript 网页特效适用专业：信息技术及其计算机相关专业开课部门：计算机系一、课程的性质与目标一、课程的性质与目标HTML5+CSS3 设计根底教程是面向计算机相关专业的一门专业根底课，涉及网页根底、HTML 标记、CSS 样式、网页布局、变形与动画等容，通过本课程的学习，学生能够了解网页 web 开展历史及其未来方

2、向，熟悉网页设计流程、掌握网络中常见的网页布局效果及变形和动画效果，学会制作各种企业、门户、电商类。二、课程设计理念与思路二、课程设计理念与思路课程设计理念：高职教育的集中实践教学环节需明确必要的理论知识的生化与知识层面的拓展，不能局限于单纯的技能训练。单纯的技能训练不是提高高等职业教育的理想课程。以能力的培养为重点，以就业为导向，培养学生具备职业岗位所需的职业能力，职业生涯开展所需的能力和终身学习的能力，实现一站式教学理念。课程设计思路：基于工作过程开发课程容，以行动为导向进展教学容设计，以学生为主体，以案例工程实训为手段，设计除理论学习与技能掌握相融合的课程容体系。教学整体设计“以职业技能

3、培养为目标，以案例工程任务实现为载体、理论学习与时间操作相结合。三、教学条件要求三、教学条件要求开发工具：Dreamweaver CS6.z.-四、课程的主要容及根本要求四、课程的主要容及根本要求第一章第一章初识初识 HTML5HTML5学习单元学习单元初识 HTML51.2.3.4.学时学时10 学时了解 HTML5 开展历程理解 HTML5 浏览器支持情况熟悉 HTML5 根本语法,掌握 HTML5 语法新特性。掌握 HTML5 相关标记及属性，能够制作简单的网页页面。了解了解掌握掌握重点重点难点难点学习目标学习目标知识点知识点HTML5 开展历史HTML5 的优势HTML5 浏览器支持情

4、况创立第一个 HTML5 页面HTML5 文档根本格式HTML5 语法HTML 标记标记的属性学习容学习容HTML5 文档头部相关标记标题和段落标记文本格式化标记特殊字符标记常用图像格式图像标记绝对路径和相对路径创立超锚点第二章第二章HTML5HTML5 页面元素及属性页面元素及属性学习单元学习单元HTML5 页面元素及属性1.2.3.4.5.学时学时6 学时掌握构造元素的使用，可以使页面分区更明确。理解分组元素的使用，能够建立简单的标题组。掌握页面交互元素的使用，能够实现简单的交互效果。理解文本层次语义元素，能够在页面中突出所标记的文本容。掌握全局属性的应用，能够使页面元素实现相应的操作。了

5、解了解掌握掌握重点重点难点难点学习目标学习目标知识点知识点ul 元素学习容学习容ol 元素dl 元素列表的嵌套应用.z.-header 元素nav 元素article 元素section 元素footer 元素figure 和 figcaption 元素hgroup 元素details 和 summary 元素progress 元素meter 元素time 元素mark 元素cite 元素draggable 属性hidden 属性spellcheck 属性contenteditable 属性第三章第三章CSS3CSS3 入门入门学习单元学习单元CSS3 入门1.2.3.4.学时学时8 学时了解

6、 CSS3 的开展历史以及主流浏览器的支持情况。掌握 CSS 根底选择器，能够运用CSS 选择器定义标记样式。熟悉 CSS 文本样式属性，能够运用相应的属性定义文本样式。理解 CSS 优先级，能够区分复合选择器权重的大小。了解了解掌握掌握重点重点难点难点学习目标学习目标知识点知识点CSS3 概述CSS3 开展历史CSS3 浏览器支持情况CSS 样式规则学习容学习容引入 CSS 样式表CSS 根底选择器字体样式属性文本外观属性CSS 层叠性和继承性CSS 优先级第四章第四章CSS3CSS3 选择器选择器学习单元学习单元学习目标学习目标CSS3 选择器学时学时8 学时1.掌握 CSS3 中新增加的

7、属性选择器，能够运用属性选择器为页面中的元素添加样式。2.理解关系选择器的用法，能够准确判断元素与元素间的关系。.z.-3.掌握常用的构造化伪类选择器，能够为一样名称的元素定义不同样式。4.掌握伪元素选择器的使用，能够在页面中插入所需要的文字或图片容。5.掌握 CSS 伪类，会使用 CSS 伪类实现超特效。知识点知识点Eatt=value 属性选择器Eatt$=value属性选择器Eatt*=value属性选择器子代选择器兄弟选择器+、:root 选择器:not 选择器:only-child 选择器学习容学习容:first-child 和:last-child 选择器:nth-child(n)

8、和:nth-last-child(n)选择器:nth-of-type(n)和:nth-last-of-type(n)选择器:empty 选择器:target 选择器:before 选择器:after 选择器伪类了解了解掌握掌握重点重点难点难点第五章第五章CSSCSS 盒子模型盒子模型学习单元学习单元CSS 盒子模型1.2.3.4.学时学时8 学时掌握盒子的相关属性，能够制作常见的盒子模型效果。掌握背景属性的设置方法，能够设置背景颜色和图像。理解渐变属性的原理，能够设置渐变背景。熟悉 CSS 控制列表样式的方式，能够运用背景图像定义列表工程符号。了解了解掌握掌握重点重点难点难点学习目标学习目标知

9、识点知识点认识盒子模型标记盒子的宽与高边框属性学习容学习容边距属性bo*-shadow 属性bo*-sizing 属性设置背景颜色设置背景图像背景与图片不透明度的设.z.-置设置背景图像平铺设置背景图像的位置设置背景图像固定设置背景图像的大小设置背景的显示区域设置背景图像的裁剪区域设置多重背景图像背景复合属性线性渐变径向渐变重复渐变第六章第六章浮动与定位浮动与定位学习单元学习单元学习目标学习目标浮动与定位学时学时8 学时1.理解元素的浮动，能够为元素设置浮动样式。2.熟悉去除浮动的方法，可以使用不同方法去除浮动。3.掌握元素的定位，能够为元素设置常见的定位模式。知识点知识点元素的浮动属性 fl

10、oat去除浮动overflow 属性元素的定位属性静态定位 static学习容学习容相对定位 relative绝对定位 absolute固定定位 fi*edz-inde*层叠等级属性元素的类型标记元素的转换了解了解掌握掌握重点重点难点难点第七章第七章表单的应用表单的应用学习单元学习单元学习目标学习目标表单的应用学时学时8 学时1.了解表单功能，能够快速创立表单。2.掌握表单相关元素，能够准确定义不同的表单控件。3.掌握表单样式的控制，能够美化表单界面。知识点知识点学习容学习容表单的构成创立表单表单属性了解了解.z.掌握掌握重点重点难点难点-Input 元素的 type 属性Input 元素的其

11、他属性te*tarea 元素select 元素datalist 元素keygen 元素output 元素CSS 控制表单样式第八章第八章多媒体技术多媒体技术学习单元学习单元多媒体技术1.2.3.4.5.学时学时6 学时熟悉 HTML5 多媒体特性。了解 HTML5 支持的音频和视频格式。掌握 HTML5 中视频的相关属性，能够在HTML5 页面中添加视频文件。掌握 HTML5 中音频的相关属性，能够在HTML5 页面中添加音频文件。了解 HTML5 中视频、音频的一些常见操作，并能够应用到网页制作中。了解了解掌握掌握重点重点难点难点学习目标学习目标知识点知识点HTML5 多媒体的特性视频和音频

12、编解码器多媒体的格式支持视频和音频的浏览器学习容学习容在 HTML5 中嵌入视频在 HTML5 中嵌入音频音视频中的 source 元素调用网页多媒体文件CSS 控制视频的宽高视频和音频的方法和事件HTML5 音视频开展趋势第九章第九章CSS3CSS3 高级应用高级应用学习单元学习单元学习目标学习目标CSS3 高级应用学时学时8 学时1.理解过渡属性，能够控制过渡时间、动画快慢等常见过渡效果。2.掌握 CSS3 中的变形属性，能够制作2D 转换、3D 转换效果。3.掌握 CSS3 中的动画，能够熟练制作网页中常见的动画效果。知识点知识点transition-property 属性transit

13、ion-duration 属性学习容学习容transition-timing-function属性transition-delay 属性transition 属性了解了解掌握掌握重点重点难点难点.z.-认识 transform2D 转换3D 转换keyframesanimation-name 属性animation-duration 属性animation-timing-function属性animation-delay 属性animation-iteration-count属性animation-direction 属性animation 属性第十章第十章实战开发制作电商首页面实战开发制作电

14、商首页面学习单元学习单元学习目标学习目标实战开发制作电商首页面学时学时6 学时1.掌握站点的建立，能够建立规的站点。2.完成首页面的制作，并能够实现简单的CSS3 动画效果。知识点知识点建立站点站点初始化设置效果图分析页面布局学习容学习容定义公共样式制作头部、导航及视频容制作容局部新品制作容局部试装制作容局部评测制作脚部信息注册及信息局部了解了解掌握掌握重点重点难点难点五、学时分配五、学时分配章目第一章初识 HTML5第二章HTML5 页面元素及属性第三章CSS3 入门第四章CSS3 选择器第五章CSS 盒子模型讲课6 学时4 学时5 学时5 学时5 学时.z.上机4 学时2 学时3 学时3

15、学时3 学时合计10 学时6 学时8 学时8 学时8 学时-第六章浮动与定位第七章表单的应用第八章多媒体技术第九章CSS3 高级应用第十章实战开发制作电商首页面合计5 学时5 学时4 学时5 学时3 学时3 学时3 学时2 学时3 学时3 学时8 学时8 学时6 学时8 学时6 学时47 学时29 学时76 学时六、考核模式与成绩评定方法六、考核模式与成绩评定方法本课程为考试课程，期末考试采用百分制的闭卷考试模式。学生的考试成绩由平时成绩30%和期末考试70%组成，其中，平时成绩包括出勤5%、作业5%、上机成绩20%。七、选用教材和主要参考书七、选用教材和主要参考书本大纲是根据教材HTML5+CSS3 设计根底教程所设计的。参考书籍：传智播客.网页设计与制作HTML+CSS中国铁道.201408传智播客.HTML+CSS+JavaScript网页制作案例教程人民邮电.201508八、大纲说明八、大纲说明本课程的授课模式为：课堂授课+上机，其中，课堂主要采用多媒体的方式进展授课，并且会通过测试题阶段测试学生的掌握程度；上机主要是编写程序，要求学生动手完成指定的程序设计或验证。撰写人：审定人：批准人：执行时间：.z.