讲授 课题 | HTML语言简介 | 课 型 | 新授 | 教案 序号 | 96-(5,6) | |||
教 学 目 标 | 知识与技能目 标 | 1、 了解HTML语法的基本构成 2、 认识几种常用标签并熟练他们的界面操作 | ||||||
过程与方法目 标 | 通过教师引导学生学习,使学生会使用本课内容 | |||||||
情感态度与价值观目标 | 使学生体验使用本软件处理问题的便捷与好处,使学生能以积极态度学习本软件 | |||||||
教学 重点 难点 及解 决办 法 | 教学重点 | 几种常用标签及它们的界面操作 | ||||||
教学难点 | 几种常用标签及它们的界面操作 | |||||||
解决办法 | 极域或多媒体演示,上机练习 | |||||||
教学手段运用 | 极域或多媒体 | |||||||
学法指导 | 教师教法 | 讲解、演示、引导 | ||||||
学生学法 | 分组探究、上机实操 | |||||||
教 师 活 动 | 学生活动 | |||||||
课 题 导 入 | [课前五分钟] [课前引入] 尽管Dreamweaver提供了可视化的操作界面,但它在网页优化方面还有些欠缺,因此掌握它的语法规则很有必要。今天我们就来学习一下吧 | |||||||
讲 授 过 程 | 一、 HTML简介 1、 概念 HTML是Hypertext Markup Language的缩写,意为超级文本语言,是用于描述网页文档的一种标记语言。 2、 基本结构 <html> 标记网页的开始 <head>标记头部的开始 Html编辑工具 :头部元素描述,如文档标题等,还可以加入css与javascript的引入标签<script />与<link /> <title>标题标签 </title> </head>标记头部的结束 <body> 标记页面正文开始页面实体部分 </body>标记正文结束 </html>标记该网页的结束 3、 创建一张网页,打开代码模式进行观察 4、 网页代码是由标签和文本构成,放在“<”“>”之间的部分,称为标签,网页中的标签均有开始标签和结束标签,大多数情况下开始标签使用<标签名>来表示,结束标签使用</标签名>来表示。 5、 一个完整的网页包括网页声明,网页头部和网页主体部分。 6、 标签格式 <标签 属性=属性值1,属性值2……>……</标签> 二、 常用的几种标签及界面操作 1、 结构中的基本标签<html>、<head>、<title>、<body> (1) 学生制作一张网页,如下图例所示 (2)经过前面的学习我们可以轻松的制作,打开代码模式观察代码,分析所制作网页与我们学习的HTML的基本结构之间的关系,根据图例2写出代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>我用代码编辑的网页</title> </head> <body> 我来写代码 </body> </html> 2、 内容标题标签 (1) 根据前边学过的知识制作图例所示的网页,观察你制作的网页与图例有什么不同 (2) 知识点提示 A标签格式:<hx>……</hx> X代表1——6的数字,数字越大字号越小 B标签作用:设置网页中内容部分的标题字体大小 (3) 界面操作 选中——属性面板中的格式中选择 3、 段落与换行标签 (1) 根据前边学过的知识制作图例所示的网页,观察你制作的网页与图例有什么不同 (2)知识点提示 A段落标记 格式:<p> 作用:使文章换段 B 换行标记 格式:<br /> 作用:使文章换行 C不同点:换段间距大,换行没间距 (3)界面操作 换行:shift+回车 换段:回车 4、粗体与斜体标签 (1)根据前边学过的知识制作图例所示的网页,观察你制作的网页与图例有什么不同 (2)知识点提示 A粗体标签 格式:<strong>……</strong> 作用:文字加粗 B斜体标签 格式:<em>……</em> 作用:文字倾斜 (3)界面操作 快捷键:ctrl+b加粗 ctrl+i倾斜 选中——属性面板——点击B、I按钮 5、特殊符号 (1)根据前边学过的知识制作图例所示的网页,观察你制作的网页与图例有什么不同 (2)知识点提示 A“<”“>”用<和>来代替的 B喜洋洋&灰太狼中的“&”使用&表示 C 四个空格用四个 表示 D版权符号使用©表示 E使用中文全角输入两个空格所占的空间等同于输入四个 空格 (3)界面操作 插入记录——HTML——特殊字符 6、水平线 (1)根据前边学过的知识制作图例所示的网页,观察你制作的网页与图例有什么不同 (2)知识点提示 A格式:<hr /> B作用:添加一条水平线 (4) 界面操作 插入记录——HTML——水平线 三、 学生提交作品 | |||||||
课 堂 小 结 | 通过直接修改网页中的代码可以很快地改变网页中各个网页元素的属性,但要记住如此众多的标签的相关属性的代码,却不是一件容易的事情,一定要牢记。 | |||||||
作 业 布 置 | 1、 实训报告册 2、 完成课上内容 | |||||||
板 书 设 计 | HTML语言简介 一、 HTML简介 二、 常用的几种标签及界面操作 三、 学生提交作品 | |||||||
教案 签字 | 签字 时间 | |||||||
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论