HTML5CSS3网站设计基础教程第2版-教学大纲

HTML5CSS3 HTML5CSS3 网站设计基础教程（第网站设计基础教程（第 2 2 版）版） 课程教学大纲课程教学大纲 （课程英文名称） 课程编号201601210011 学分5 学分 学时76 课时（其中讲课课时58 课时上机课时18 课时） 先修课程先修课程计算机基础、计算机网络、计算机应用 后续课程后续课程UI 设计、 JavaScript网页特效 适用专业信息技术及其计算机相关专业 开课部门计算机系 一、课程的性质与目标一、课程的性质与目标 HTML5CSS3 网站设计基础教程（第2 版） 是面向计算机相关专业的一门专业基 础课，涉及网页基础、HTML 标记、CSS 样式、网页布局、变形与动画等内容，通过本课 程的学习，学生能够了解网页 web 发展历史及其未来方向，熟悉网页设计流程、掌握网络 中常见的网页布局效果及变形和动画效果，学会制作各种企业、门户、电商类网站。 二、课程设计思路和教学要求二、课程设计思路和教学要求 课程设计理念 高职教育的集中实践教学环节需明确必要的理论知识的生化与知识层面 的拓展，不能局限于单纯的技能训练。单纯的技能训练不是提高高等职业教育的理想课程。 以能力的培养为重点，以就业为导向，培养学生具备职业岗位所需的职业能力， 职业生涯发 展所需的能力和终身学习的能力，实现一站式教学理念 课程设计思路基于工作过程开发课程内容， 以行动为导向进行教学内容设计， 以学生 为主体，以案例（项目）实训为手段，设计除理论学习与技能掌握相融合的课程内容体系。 教学整体设计“以职业技能培养为目标，以案例（项目）任务实现为载体、理论学习与时间 操作相结合” 。 开发工具Dreamweaver CS6 三、课程的主要内容及基本要求三、课程的主要内容及基本要求 第一章第一章初识初识 HTML5HTML5 学习单元学习单元初识 HTML5 1.了解 HTML5 发展历程 2.理解 HTML5 浏览器支持情况 学习目标学习目标 3.熟悉 HTML5 基本语法,掌握 HTML5 语法新特性。 4.掌握 HTML5 相关标记及属性，能够制作简单的网页页面。 知识点知识点 HTML5 发展历史及优 势 学习内容学习内容HTML5 浏览器支持情 况 创建第一个HTML5页 面 √ √ √ √ 了解了解 √ √ 熟悉熟悉掌握掌握重点重点难点难点 课时课时10 课时 HTML5 文档基本格式 HTML5 语法 HTML 标记 标记的属性 HTML5 文档头部相关 标记 标题和段落标记 文本格式化标记 特殊字符标记 常用图像格式 图像标记 绝对路径和相对路径 创建超链接 锚点链接 阶段案例制作 HTML5 百科页面 √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ 第二章第二章HTML5HTML5 页面元素及属性页面元素及属性 学习单元学习单元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 元素 全局属性 阶段案例制作电影影 评网 √ √ √ √ √ √√ √ 第三章第三章CSS3CSS3 入门入门 学习单元学习单元CSS3 入门课时课时8 课时 1.了解 CSS3 的发展历史以及主流浏览器的支持情况。 2.掌握 CSS 基础选择器，能够运用CSS 选择器定义标记样式。 学习目标学习目标 3.熟悉 CSS 文本样式属性，能够运用相应的属性定义文本样式。 4.理解 CSS 优先级，能够区分复合选择器权重的大小。 知识点知识点 CSS3 简介 CSS 样式规则 引入 CSS 样式表 标记选择器 学习内容学习内容 类选择器 id 选择器 通配符选择器 标签指定式选择器 后代选择器 √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ 了解了解 √ √ 熟悉熟悉掌握掌握 √ √ √ √ √ √ 重点重点 √ √ 难点难点 并集选择器 字体样式属性 文本外观属性 CSS 层叠性和继承性 CSS 优先级 阶段案例制作服装 推广软文 √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ 第四章第四章CSS3CSS3 选择器选择器 学习单元学习单元CSS3 选择器课时课时8 课时 1.掌握 CSS3 中新增加的属性选择器，能够运用属性选择器为页面中的元素 添加样式。 2.理解关系选择器的用法，能够准确判断元素与元素间的关系。 学习目标学习目标 3.掌握常用的结构化伪类选择器，能够为相同名称的元素定义不同样式。 4.掌握伪元素选择器的使用，能够在页面中插入所需要的文字或图片内容。 5.掌握 CSS 伪类，会使用 CSS 伪类实现超链接特效。 知识点知识点 E[attvalue] 属性选 择器 学习内容学习内容 E[attvalue]属性选 择器 E[att*value]属性选√ √ √ √ 了解了解熟悉熟悉掌握掌握 √ √ 重点重点难点难点 择器 子代选择器（） 兄弟选择器（、） root 选择器 not 选择器 only-child 选择器 first-child 和last-child选择器 nth-childn 和nth-last-childn选 择器 nth-of-typen 和nth-last-of-typen 选择器 empty 选择器 target 选择器 before 选择器 after 选择器 链接伪类 阶段案例制作网页 设计软件列表 √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √ √√ √√ √ √ √ √ √ √ √ √ √ √ √ √ √√ √ 第五章第五章CSSCSS 盒子模型盒子模型 学习单元学习单元CSS 盒子模型课时课时8 课时 1.掌握盒子的相关属性，能够制作常见的盒子模型效果。 2.掌握背景属性的设置方法，能够设置背景颜色和图像。 学习目标学习目标 3.理解渐变