HTML教案第四章（5篇范例）

第一篇：HTML教案第四章

课程名称：使用HTML语言开发商业站点

教案

《 HTML 》理论课教案

第4章 CSS样式表

一、整章授课思路 [100分钟].................................................................................................................2 1.2.2.1 2.2 2.3 3.回顾、预习检查、任务、目标部分 [10分钟].....................................................2 [表单页面的基本结枸[10分钟].............................................................................2 为什么需要表单？.......................................................................2 表单包含的控件：.....................................错误！未定义书签。表单页面的基本结构。.............................错误！未定义书签。

各种表单控件的逐一介绍[20分钟].......................................................................3 3.1 表单元素的统一格式。.............................错误！未定义书签。3.2 各种表单元素逐一介绍，先讲解语法，然后举例错误！未定义书签。4.5.5.1 5.2 5.3 5.4 5.5 6.7.课堂练习[15分钟]...................................................................................................3 框架[25分钟]..........................................................................错误！未定义书签。框架窗口的组成...........................................................................3 框架的使用场合。.....................................错误！未定义书签。框架的基本结构。.....................................错误！未定义书签。如何创建多个复杂的窗口。.....................错误！未定义书签。如何设置窗口链接的显示位置。.............错误！未定义书签。

课堂练习2[15分钟]................................................................................................5 总结[5分钟].............................................................................................................6

二、学员问题汇总...................................................................................................错误！未定义书签。

三、作业布置.............................................................................................................................................7

课程名称：使用HTML语言开发商业站点

教案

CSS主要用于改变网页中标签的样式，使网页变得更华丽。可以从外观上更能吸引读者。CSS相当于华丽的衣服

样式表能实现内容与样式的分离，方便团队开发。

4.样式表的基本语法[10分钟]

1)样式表的基本结构。2)样式规则并举例说明。3)引入类样式。

 课堂案例：样式表的基本语法

5.文本属性[5分钟] 引入：

首先从文本的大小，颜色，字体等来描述文本属性。强调用样式来实现文本的大小颜色字体的显示的好处

课堂案例：

6.课堂练习[10分钟]

做“申请表”的表单练习，参考“课堂联系案例课堂练习1”。

7.背景属性[5分钟]

 引入：

首先从文本的大小，颜色，字体等来描述文本属性。 讲解要点：

backcolor , background-image ,background-repeat 3个属性的基本用法。

 注意：

课程名称：使用HTML语言开发商业站点

教案

9.特殊样式[5分钟]

 讲解要点：

无下划线的超俩链接的制作方法。 课堂案例：

10.课堂练习2[10分钟]

编写如下图所示效果对应的HTML代码

11.制作图片按钮[10分钟]  讲解要点：

图片按钮的制作方法。 课堂案例：

课程名称：使用HTML语言开发商业站点

教案

二、作业布置

参考答案：外部样式表练习

第二篇：html教案

《HTML基础》教案

教材：《dreamweaver cs3网页制作与实训》

执教：罗执清

一、教学目标：

1、了解HTML的概念、作用及特点

2、理解HTML文档结构

3、掌握标签的使用规范

4、了解常用标签的用法

二、教学重点：

1、HTML文件结构

2、标签使用规范

3、常用标签的使用

三、教学难点： HTML概念的理解

四、教学方法：

直观演示和任务驱动相结合

五、教学过程：

1、回顾站点管理相关操作

2、HTML概念及作用

3、HTML文件结构

：HTML文档开始。

：文档头部开始。

：文档标题开始。HTML基础：文档标题。：文档标题结束。

：文档头部结束。

：文档主体开始。

一个简单的网页：文档主体内容，它是网页的最主要部分。

第三篇：HTML 教案

HTML语言

一、基本元素

1.html元素：… 2.head元素：… 3.title元素：在浏览器标题栏和windows任务栏上显示…<title> 4.body元素：<body>…<h2><a name="4" >第四篇：HTML教案第四章</a></h2>第9次课 CSS基础课时：4课时一、教学目标1.2.3.4.会创建无下划线的超链接样式会创建统一外观的字体文本会创建个性化的表单会创建个性化的表格二、教学重点1.样式的基本语法2.会创建常见的样式：统一的文字、颜色等外观、无下划线的超链接、细边框输入框三、教学难点内嵌样式、行内样式、样式表文件的使用场合四、教学过程【回顾】[10分钟] 回顾之前所学基本标签，引导学生在网页美化以及格式修改中遇到的问难。从而引入样式表。前几次课所学的标签，在网页中呈现出的效果，比较简单，样式比较单一。CSS主要用于改变网页中标签的样式，使网页变得更华丽。可以从外观上更能吸引读者。CSS相当于华丽的衣服样式表能实现内容与样式的分离，方便团队开发。1.样式表的基本语法[10分钟]1)样式表的基本结构。2)样式规则并举例说明。3)引入类样式。 课堂案例：样式表的基本语法2.文本属性[10分钟] 引入：首先从文本的大小，颜色，字体等来描述文本属性。强调用样式来实现文本的大小颜色字体的显示的好处5.方框属性[15分钟] 引入：首先从文本的大小，颜色，字体等来描述文本属性。 讲解要点：1)盒子模式：以网页中放入的一副图片，说明盒子模式设计的各种边界、填充、边框的含义。2)应用边框属性、填充属性，制作常见的表格多列中分界线样式。3)应用边框属性，制作细边框输入框样式。 课堂案例：6.特殊样式[5分钟] 讲解要点：无下划线的超俩链接的制作方法。 课堂案例：7.课堂练习2[10分钟]编写如下图所示效果对应的HTML代码一、作业布置参考答案： <HTML> <HEAD> <META http-equiv=“Content-Type” content=“text/html;charset=gb2312”> <TITLE>外部样式表练习

第五篇：HTML教案第五章

课程名称：使用HTML语言开发商业站点

教案

《HTML》理论课教案

第5章使用Dreamweaver制作网页

一、整章授课思路 [100分钟].................................................................................................................2 1.2.3.4.5.6.7.8.9.10.回顾、预习检查、任务、目标部分 [10分钟].......................................................2 基本标签的使用[10分钟]........................................................................................2 表格的使用，创建表格布局页面[10分钟].............................................................3 课堂练习1[10分钟]................................................................................................3 表单的使用，结合表格布局进行使用 [10分钟]...................................................4 课堂练习2 [10分钟]................................................................................................4 制作框架网页[10分钟]............................................................................................4 制作样式表 [15分钟]..............................................................................................5 课堂练习3 [10分钟]................................................................................................5 总结[5分钟].............................................................................................................5

二、学员问题汇总.....................................................................................................................................5

三、作业布置.............................................................................................................................................6

-课程名称：使用HTML语言开发商业站点

教案

结合如何制作一个图文并茂的页面示例，仿效演示并穿插讲解：

1)2)3)4)5)6)如何设置页面背景、标题。如何插入图片。

如何插入段落、换行。如何设置超链接。

如何格式化文本：文字颜色、字号等如何插入项目列表

3.表格的使用，创建表格布局页面[10分钟]

讲解重点：

结合如何制作一个新产品展示表格页面，依次演示并穿插讲解：

1.创建跨行或跨列的表格。2.设置表格背景

3.设置单元格背景色，对齐方式。

4.课堂练习1[10分钟]

练习使用表格布局多张图片，关键是设置表格的边框、填充、边界均为0。

教案

课程名称：使用HTML语言开发商业站点

教案

1）2）如何制作框架窗口。

如何设置超链接打开目标窗口。

8.制作样式表 [15分钟]

结合如何美化表格页面、制作图片按钮、依次演示并穿插讲解：（1）如何使用Dreamweaver制作各类样式。（2）如何应用样式

如何使用Dreamweaver制作样式，参考文件夹“补充案例使用Dreamweaver制作样式实例.htm”

9.课堂练习3 [10分钟] 练习上述讲解的各种样式

10.总结[5分钟] 7)8)9)10)创建表格最少需要那三个标签？简述表格的基本结构。

跨行跨列的表格，主要在什么情况下使用？给你一个表格，你会从哪些方面进行美化？

二、学员问题汇总

 问题1：

答：。。。 问题2：

--6 课程名称：使用HTML语言开发商业站点