资源简介 (共27张PPT)第14课初识HTML5浙江摄影出版社四年级下新知导入我想制作一份图文并茂、有声有色且易于交流的“数字名片”，可找不着好帮手，怎么办?很多H5页面制作工具能帮你实现。别着急，我们先来了解什么是H5。新知讲解H5是HTML5的简称，是指描述网页的标准语言，“5”是指它的第5个版本。新知讲解一、认识HTMLHTML是超文本标记语言(HyperTextMarkupLanguage)的英文缩写，该语言使用一套标签或标记来描述网页中的文字、图片、表格、链接等。新知讲解用浏览器浏览网页时，一般通过单击鼠标右键，选择“查看网页源代码”，就可以看到当前网页的HTML源代码了。新知讲解新知讲解为什么有这么多尖括号啊?这就是HTML标签，它们通常是成对出现的，有着特殊的含义。新知讲解标签就是标记文档的标题。<br/>新知讲解<br/>浏览器的作用主要是读取HTML文档，<br/>并以网页的形式显示文档中的内容。<br/>小知识<br/>新知讲解<br/>HTML文件结构如下<br/>＜<br/>html:＞标记网页的开始<br/>＜head＞标记头部的开始<br/>＜title＞显示在浏览器左上方的标题＜/<br/>title><br/>＜/head＞标记头部的结束<br/>新知讲解<br/>＜<br/>body＞标记页面正文开始<br/>＜/body＞标记页面正文结束<br/>＜/html＞标记网页的结束<br/>HTML标签是由尖括号包围的关键词，通常成对出现。<br/>合作探究<br/>试一试<br/>打开一个网页，查看该网页的源代码<br/>新知讲解<br/>二、从HTML到HTML<br/>5<br/>作为互联网的通用标准语言，<br/>HTML在计算机网络的发展过程<br/>中起着很重要的作用。<br/>HTML在1993年发布1.0版以后，<br/>随着网络技术的发展，多次改版升级，功能越来越完善，能更好地处理互联网中的应用，如网页中图形的绘制，音频、视频的加载等。<br/>新知讲解<br/>HTML<br/>5是随着移动终端的快速普及而得到广泛应用的。<br/>这个版本的优点主要是可以跨设备、跨平台使用，页面加载更快，用户体验更好。<br/>HTML5的设计目的是为了在移动设备上支持多媒体。<br/>新知讲解<br/>打开网页，<br/>按下Ctrl+U键，<br/>就能快速查看你正在浏览的网页的源代码了。<br/>教你一招<br/>合作探究<br/>试一试<br/>打开一个网页，按下Ctrl+U键查看该网页的源代码<br/>新知讲解<br/>HTML<br/>5提供了许多新的功能，<br/>实现了更丰富的图形化界面和更友好的人机交互模式，页面内容的交互性更强了。<br/>三、<br/>基于HTML<br/>5的应用特点<br/>新知讲解<br/>阅读材料<br/>HTML文档的常用标签功能介绍<br/>基本标签<br/>创建一个HTML文档<br/><html></html><br/>设置文档头部<br/><head></head><br/>设置文档的可见部分<br/><body></body><br/>新知讲解<br/>标题标签<br/>设置标题<br/><title>文档整体属性设置背景颜色设置文本文字颜色text=?>设置链接颜色link=?>新知讲解图形元素添加一幅图像src=name格式排版表格创建一个新的行>插入一个回车换行符创建一个表格开始表格中的每一行开始一行中的每一格新知讲解文本标签创建预格式化文本创建最大的标题创建最小的标题创建黑体字创建斜体字设置字体大小，从1到7设置字体的颜色课堂练习1.打开三个不同网页，并查看各源代码，比较它们的不同。课堂总结总结本节课所学内容作业布置上网搜索关于Word文档、TXT文件、HTML文件格式的说明，比较这三种文件格式的区别，将自己的发现整理成研究报告。板书设计一、认识HTML二、从HTML到HTML5三、基于HTML5的应用特点https://www.21cnjy.com/help/help_extract.php中小学教育资源及组卷应用平台浙江摄影出版社信息技术四年级下第14课初识HTML5教学设计课题初识HTML5单元第三单元学科信息技术年级四年级学习目标1.了解超文本标记语言的概念；了解查看源代码的基本操作。2.理解基于HTML5的应用特点。重点查看源代码的基本操作；理解基于HTML5的应用特点。难点理解基于HTML5的应用特点。教学过程教学环节教师活动学生活动设计意图导入新课我想制作一份图文并茂、有声有色且易于交流的“数字名片”，可找不着好帮手，怎么办?很多H5页面制作工具能帮你实现。别着急，我们先来了解什么是H5。思考激发学生学习兴趣并快速进入学习状态讲授新课H5是HTML5的简称，是指描述网页的标准语言，“5”是指它的第5个版本。一、认识HTMLHTML是超文本标记语言(HyperTextMarkupLanguage)的英文缩写，该语言使用一套标签或标记来描述网页中的文字、图片、表格、链接等。用浏览器浏览网页时，一般通过单击鼠标右键，选择“查看网页源代码”，就可以看到当前网页的HTML源代码了。为什么有这么多尖括号啊?这就是HTML标签，它们通常是成对出现的，有着特殊的含义。标签就是标记文档的标题。<br/>小知识<br/>浏览器的作用主要是读取HTML文档，<br/>并以网页的形式显示文档中的内容。<br/>HTML文件结构如下<br/>＜<br/>html:＞标记网页的开始<br/>＜head＞标记头部的开始<br/>＜title＞显示在浏览器左上方的标题＜/<br/>title><br/>＜/head＞标记头部的结束<br/>＜<br/>body＞标记页面正文开始<br/>＜/body＞标记页面正文结束<br/>＜/html＞标记网页的结束<br/>HTML标签是由尖括号包围的关键词，通常成对出现。<br/>试一试<br/>打开一个网页，查看该网页的源代码<br/>二、从HTML到HTML<br/>5<br/>作为互联网的通用标准语言，<br/>HTML在计算机网络的发展过程<br/>中起着很重要的作用。<br/>HTML在1993年发布1.0版以后，<br/>随着网络技术的发展，多次改版升级，功能越来越完善，能更好地处理互联网中的应用，如网页中图形的绘制，音频、视频的加载等。<br/>HTML<br/>5是随着移动终端的快速普及而得到广泛应用的。<br/>这个版本的优点主要是可以跨设备、跨平台使用，页面加载更快，用户体验更好。<br/>HTML5的设计目的是为了在移动设备上支持多媒体。<br/>教你一招<br/>打开网页，<br/>按下Ctrl+U键，<br/>就能快速查看你正在浏览的网页的源代码了。<br/>试一试<br/>打开一个网页，按下Ctrl+U键查看该网页的源代码<br/>三、<br/>基于HTML<br/>5的应用特点<br/>HTML<br/>5提供了许多新的功能，<br/>实现了更丰富的图形化界面和更友好的人机交互模式，页面内容的交互性更强了。<br/>阅读材料<br/>HTML文档的常用标签功能介绍<br/>基本标签<br/>创建一个HTML文档<br/><html></html><br/>设置文档头部<br/><head></head><br/>设置文档的可见部分<br/><body></body><br/>文档整体属性<br/>设置背景颜色<br/><bodybgcolor=?><br/>设置文本文字颜色<br/><body<br/>text=?><br/>设置链接颜色<br/><body<br/>link=?><br/>标题标签<br/>设置标题<br/><title>图形元素添加一幅图像src=name格式排版创建一个新的行>插入一个回车换行符表格创建一个表格开始表格中的每一行开始一行中的每一格文本标签创建预格式化文本创建最大的标题创建最小的标题创建黑体字创建斜体字设置字体大小，从1到7设置字体的颜色课堂练习1.打开三个不同网页，并查看各源代码，比较它们的不同。通过老师演示学生动手操作，提高动手能力。小组交流、分享学生小组间讨论，共同完成任务。通过教师的讲解，以小组合作的方式，开展探讨交流，完成任务。学生小组间讨论，共同完成任务。通过教师的讲解，以小组合作的方式，开展探讨交流，完成任务。学生小组间讨论，共同完成任务，并分组汇报。培养学生组间合作能力，并且炼动手能力培养学生动手操作能力，并且锻炼学生的语言组织能力和表达的能力。通过小组合作，加强学生组内团结、共同完成任务培养学生动手操作能力，并且锻炼学生的语言组织能力和表达的能力。通过小组合作，加强学生组内团结、共同完成任务培养学生独立完成练习的能力。课堂总结分小组总结归纳，教师补充。各组汇报总结，其他小组成员做补充。锻炼学生的总结能力，逻辑思维、语言表达能力。作业布置上网搜索关于Word文档、TXT文件、HTML文件格式的说明，比较这三种文件格式的区别，将自己的发现整理成研究报告。板书一、认识HTML二、从HTML到HTML5三、基于HTML5的应用特点21世纪教育网www.21cnjy.com精品试卷·第2页（共2页）21世纪教育网(www.21cnjy.com) 展开更多...... 收起↑ 资源列表 第14课 初识HTML5.docx 第14课 初识HTML5.pptx
资源列表
