网页基础与制作 11_第1页
网页基础与制作 11_第2页
网页基础与制作 11_第3页
网页基础与制作 11_第4页
网页基础与制作 11_第5页
已阅读5页,还剩1页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

第1章PHP开篇PAGE16《网页设计与制作(HTML5+CSS3+JavaScript)(第2版)》教学设计课程名称:授课年级:授课学期:教师姓名:年月课题名称第2章运用HTML5搭建网页结构计划课时6课时教学引入近年来,HTML5成为信息技术(informationtechnology,IT)行业最热门的话题。HTML5以自身为条件开发出了许多功能,从桌面浏览器到移动应用,HTML5从根本上改变了开发商开发Web应用的方式。作为网页的设计人员,也应该顺应时代潮流,掌握HTML5相关技术。本章将对HTML5的基本结构和语法、文本控制标签、图像标签及超链接标签进行详细讲解。教学目标使学生了解HTML和HTML5,能够归纳HTML和HTML5的概念使学生熟悉HTML标签,能够归纳常用HTML标签的类型和基本用法使学生熟悉HTML文档的基本格式,能够归纳文档的组成部分及其用途使学生熟悉特殊字符标签,能够列举至少五个特殊字符以及其对应的替代代码使学生了解图像格式,能够归纳常用图像格式的特点使学生了解绝对路径和相对路径,能够归纳绝对路径和相对路径的区别使学生熟悉HTML5新标签,能够归纳这些标签的用途使学生掌握标签属性的设置方式,能够根据需要为标签设置指定的属性使学生掌握头部标签的使用,能够使用头部相关标签设置页面标题和元信息使学生掌握标题和段落标签的使用,能够实现设置标题和换行的效果使学生掌握文本样式标签的使用,能够根据需要设置文本的基本样式使学生掌握文本格式化标签的使用,能够根据需要设置文本的基本格式使学生掌握图像标签的使用,能够灵活运用<img>标签定义图像教学重点文档基本格式标题和段落标签文本样式标签文本格式化标签图像标签<img>教学难点图像标签<img>绝对路径和相对路径教学方式课堂教学以PPT讲授为主,并结合多媒体进行教学教学过程第一课时(认识HTML和HTML5、认识标签、文档基本格式、标签属性、HTML5文档头部相关标签)一、复习巩固教师通过上节课作业的完成情况,对学生吸收不好的知识点进行再次巩固讲解。二、通过直接引入的方式导入新课HTML5作为HTML的最新版本,是HTML的传递和延续。从某种意义上讲,从HTML4.0、XHTML到HTML5是HTML超文本标记语言的更新与规范过程。因此,HTML5并没有给开发者带来多大的冲击。本节课将具体介绍HTML和HTML5的基础知识。三、新课讲解知识点1-认识HTML和HTML5教师通过PPT的方式讲解认识HTML和HTML5。HTML的概念HTML5的概念知识点2-认识标签教师通过PPT的方式讲解认识标签。双标签和单标签注释标签知识点3-文档基本格式教师通过PPT的方式讲解文档基本格式。<!DOCTYPEhtml>标签<html>标签<head>标签<body>标签知识点4-标签属性教师通过PPT结合实际操作的方式讲解标签属性。标签属性的作用HTML标签设置属性的语法格式演示如何使用标签的属性对网页进行修饰知识点5-HTML5文档头部相关标签教师通过PPT结合实际操作的方式讲解HTML5文档头部相关标签。设置页面标题标签<title>定义页面元信息标签<meta>四、归纳总结教师回顾本节课所讲的内容,并通过测试题的方式引导学生解答问题并给予指导。五、布置作业教师通过高校教辅平台()布置本节课作业以及下节课的预习作业。第二课时(标题和段落标签、文本样式标签)一、复习巩固教师通过上节课作业的完成情况,对学生吸收不好的知识点进行再次巩固讲解。二、通过直接引入的方式导入新课不管网页内容如何丰富,文字自始至终都是网页中最基本的元素。为了使文字排版整齐、结构清晰,HTML中提供了一系列文本控制标签,如<h1>~<h6>、段落标签<p>等。本节课将对文本控制标签进行详细讲解。三、新课讲解知识点1-标题和段落标签教师通过PPT结合实际操作的方式讲解标题和段落标签。标题标签<h1>~<h6>段落标签<p>水平线标签<hr>换行标签<br>知识点2-文本样式标签教师通过PPT结合实际操作的方式讲解文本样式标签。文本样式标签的作用文本样式标签的语法格式<font>标签的常用属性演示<font>标签的使用四、归纳总结教师回顾本节课所讲的知识,并通过测试题的方式引导学生解答问题并给予指导。五、布置作业教师通过高校教辅平台()布置本节课作业以及下节课的预习作业。第三课时(文本格式化标签、特殊字符标签)一、复习巩固教师通过上节课作业的完成情况,对学生吸收不好的知识点进行再次巩固讲解。二、通过直接引入的方式导入新课文本格式化标签用于设置文本的格式,特殊字符标签用于在网页中显示特殊字符。本节课将对文本格式化标签和特殊字符标签进行讲解。三、新课讲解知识点1-文本格式化标签教师通过PPT结合实际操作的方式讲解文本格式化标签。文本格式化标签的作用常用的文本格式化标签演示<b>、<strong>、<ins>、<i>、<em>和<del>的效果知识点2-特殊字符标签教师通过PPT结合实际操作的方式讲解特殊字符标签。特殊字符标签的作用常用特殊字符标签四、归纳总结教师回顾本节课所讲的知识,并通过测试题的方式引导学生解答问题并给予指导。五、布置作业教师通过高校教辅平台()布置本节课作业以及下节课的预习作业。第四课时(常用图像格式、图像标签<img>、绝对路径和相对路径)一、复习巩固教师通过上节课作业的完成情况,对学生吸收不好的知识点进行再次巩固讲解。二、通过直接引入的方式导入新课浏览网页时我们常常会被网页中的图像所吸引,巧妙地在网页中穿插图像可以让网页内容变得更加丰富多彩。本节课将为大家介绍几种常用的图像格式,以及在网页中插入图像的技巧。三、新课讲解知识点1-常用图像格式教师通过PPT的方式讲解常用图像格式。GIF格式PNG格式JPG格式知识点2-图像标签<img>教师通过PPT结合实际操作的方式讲解图像标签<img>。图像标签的作用。图像标签的语法格式。图像标签的属性。知识点3-绝对路径和相对路径教师通过PPT的方式讲解绝对路径和相对路径。绝对路径相对路径四、归纳总结教师回顾本节课所讲的知识,并通过测试题的方式引导学生解答问题并给予指导。五、布置作业教师通过高校教辅平台()布置本节课作业以及下节课的预习作业。第五课时(认识HTML5新标签、阶段案例:输出文章)一、复习巩固教师通过上节课作业的完成情况,对学生吸收不好的知识点进行再次巩固讲解。二、通过直接引入的方式导入新课HTML5中引入了很多新的标签元素和属性,这是HTML5的一大亮点,这些新增元素使文档结构更加清晰明确,属性则使标签的功能更加强大,掌握这些元素和属性是正确使用HTML5构建网页的基础。本节课将对HTML5新增标签进行讲解。三、新课讲解知识点1-认识HTML5新标签教师通过PPT的方式讲解认识HTML5新标签。结构性标签。多媒体标签。表单标签。知识点2-阶段案例:输出文章教师通过PPT结合实际操作的方式讲解阶段案例:输出文章。案例效果。案例实现。四、归纳总结教师回顾本节课所讲的知识,并通过测试题的方式引导学生解答问题并给予指导。五、布置作业教师通过高校教辅平台(

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论