01第一章HTML概述..doc

江西新华电脑专修学院课堂教学教案 （电脑应用课使用） 课程名称 Dreamweaver网页设计 教学对象 电商、应用专业 教 材 Dreamweaver网页设计 授课内容 HTML简介 课 时 6课时 教学目的 与要求 通过本节课的学习，您应该学会以下知识和技能 1 掌握HTML语言的结构和语法 2 掌握标记的属性的属性设置 3 掌握HTML标签网页中的具体应用 重点、难点 1 重点掌握HTML语言的结构和语法，以及各种标记的属性的属性设置、在网页中的具体应用。 2 难点是最终能用HTML代码写出简单的网页知识点： 关键字： 标签 语法结构 课 型 新授课 教学方法 讲授法、演示法、讨论法 教学过程 导入课题（10分钟） 通过打开一些网页,查看HTML代码,让学生认识到学习HTML的目的就是为了了解什么是网页以及网页的制作过程。同时学习HTML也是为了学习网页后台打下基础。 知识剖析 （270分钟） 什么是HTML？(10分钟) HTML即HyperText Markup Language（超文本链接标记语言）的缩写，它是一种基于Web、不受操作系统限制且通用性极佳的脚本语言，其文件格式可以是*.htm或*.html； HTML脚本编辑器（10分钟） 1.记事本 2.Macromedia Dreamweaver MX 2008 3 Word 4. FrontPage HTML脚本的相关概念（30分钟） 1.标记：凡是用 符号扩起来的关键字，我们就叫它标记．如html /html 2.标记分类：标记分为单向标记、双向标记和中性标记． 3.标记属性：用来丰富和修饰标记. 4.标记属性值：与属性相匹配的具体参数． 基本语法（20分钟） 基本格式: 标记名称 属性=属性值 属性=属性值…… 标记:是html文件的一种基本结构单位，一对标记以及它们之间的所有内容，标记能独立体现一种页面效果或实现一种功能，可以看作是一个功能模块。 基本单位（20分钟） 1.长度单位 1.1 相对长度:% 1.2 绝对长度:pixel(像素) 2. 颜色单位 2.1 16进制:#RRGGBB 2.2 直接颜色名称:使用颜色的英文名称 3. URL路径 3.1 概念：URL统一资源定位器，是一种互联网地址的表示方法。 3.2 绝对路径:是将服务器上磁盘驱动器名称和完整的路径都写出来.如: a href=“file:///D:/website/index.htm” 3.3 相对路径:相对于当前的HTML文档所在的目录或站点根目录的路径 格式:相对关系/部分路径/文件名 HTML脚本结构（30分钟） html head titleWelcome to XinHua Computer School !!/title /head body 多媒体网页设计，这是我的第一个页面！ /body /html 各种标记说明（180分钟） 文档声明标记：html.../html 1.1语法：html…/html（指定并告知浏览器当前的文档类型是HTML文档，所有html标记必须包含在html与/html之间） 页面标题标记：title…/title 2.1语法：title…/title（该标记用来指定网页标题栏显示的标题） 文档头部标记：head…/head 3.1语法：head…/head（指定当前文档的头部即文档说明信息，包含在其中的说明信息主要有title、meta与script等标记，其中meta标记指当前文档被搜索引擎使用的关键字，样式的预先定义、script标记指定义头部的脚本语言及其函数） 文档体标记：body…/body 4.1语法：body…/body（所有在浏览器中显示网页元素均需包含在该标记中） 4.2属性： 4.2.1 bgcolor＝colorvalue（网页的背景颜色） 4.2.2 background＝URL（网页背景图像的位置） 4.2.3 bgproperties＝fixed（锁定背景图象） 4.2.4 leftmargin＝数据（网页内容的左边距） 4.2.5 topmargin＝数据（网页内容的上边距） 4.2.6 text＝colorvalue（网页文本的默认颜色） 文本格式欲定义标记：pre…/pre 5.1 语法：pre…/pre（保留文本的原始格式） 5.2 属性：width＝size（文本的宽度） 5.3 应用实例： …body pre 多么渴望听到你笑声, 渴望听到你真心的话语。 而现在牵挂你却已经成为我的习惯！ ――――――― /pre /body … 文本段落