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