HTMLCSSJavaScript教学教案.doc

《HTML CSS JavaScript网页制作》 教学教案 第1讲 课时内容 HTML基础 授课时间 80分钟 课时 2 教学内容 (在当今社会中，网络已成为人们生活的一部分，网页设计技术已成为学习计算机的重要内容之一。目前大部分网页都采用可视化网页编辑软件来制作的，但是无论采用哪一种网页编辑软件，最后都是将所设计的网页转化为HTML。HTML是搭建网页的基础语言，如果不了解HTML，就不能灵活地实现想要的网页效果。本章就来介绍HTML的基本概念和编写方法以及浏览HTML文件的方法，使读者对HTML有个初步的了解，从而为后面的学习打下基础。 教学重点 了解HTML的基本概念 掌握HTML文件的编写方法 掌握使用浏览器浏览HTML文件 内容大纲 1.1 HTML的基础概念 1.1.1 HTML简介 1.1.2 HTML文件的 基本结构 1.1.3 认识HTML标记 1.2 HTML文件的编写方法 1.2.1使用笔记本手工编写HTML 1.2.2使用Dreamweaver编写HTML文件 1.3使用浏览器浏览HTML文件 1.3.1查看页面效果 1.3.2查看源文件 1.4练习题 第2讲 课时内容 HTML基本标记 授课时间 80分钟 课时 2 教学内容 (一个完整的HTML文档必须包含3个部分：一个由html元素定义的文档版本信息，一个由head定义各项声明的文档头部和一个由body定义的文档主体部分。head作为各种声明信息的包含元素出现在文档的顶端，并且要先于body出现。而body用来显示文档主体内容。文字是网页中最基本的信息载体，文字通过不同的排版方式、不同的设计风格排列在网页上，提供了丰富的信息。文字的控制与布局在网页设计中占了很大比例，因此掌握好文字的使用，对于网页制作来说是最基本的。本章就来讲解这些基本标记的使用，这些都是一个完整的网页必不可少的。 教学重点 掌握HTML头部标记 掌握标题标记 掌握元信息标记 掌握页面的主体标记 掌握页面注释标记 内容大纲 2.1 HTML头部标记head 2.2标题标记title 2.3元信息标记meta 2.3.1设置页面关键字 2.3.2设置页面说明 2.3.3定义编辑工具 2.3.4设置作者信息 2.3.5设置网页文字及语言 2.3.6设置网页的定制跳转 2.4页面注释标记！- - 2.5标题字 2.5.1标题字标记h 2.5.2标题字对齐属性align 2.6段落标记 2.6.1段落标记p 2.6.2换行标记br 2.6.3不换行标记nobr 2.7水平线 2.8其他标记 2.8.1插入空格 2.8.2插入特殊符号 2.9练习题 第3讲 课时内容 建立超链接 授课时间 80分钟 课时 2 教学内容 (超级链接是HTML文档的最基本特征之一。超级链接的英文名是hyperlink，它能够让浏览者在各个独立的页面之间方便地跳转。每个网站都是由众多的网页组成，网页之间通常都是通过链接方式相互关联的。超链接的范围很广，可以将文档中的任何文字及任意位置的图片设置为超级链接。超链接有外部链接、电子邮件链接、锚点链接、空链接、脚本链接 。 教学重点 了解超级链接的基本知识 掌握内部链接 掌握锚点链接 掌握外部链接 内容大纲 3.1 超链接的基本知识 3.1.1 绝对路径 3.1.2 相对路径 3.2 内部链接 3.2.1 认识内部链接 3.2.2 链接的目标窗口 3.2.3建立锚点3.3锚点链接 3.3.1建立同一页面中的锚点 3.3.2建立其他页面中的锚点 3.4 外部链接 3.4.1 链接到外部网站 3.4.2 链接到E-mail 3.4.3 链接到FTP 3.4.4 链接到Telnet 3.4.5 下载文件 3.5练习题 第4讲 课时内容 使用图像 授课时间 80分钟 课时 2 教学内容 图像是网页中不可缺少的元素，巧妙地在网页中使用图像可以为网页增色不少。网页美化最简单、最直接的方法就是在网页上添加图像，图像不但使网页更加美观、形象和生动，而且使网页中的内容更加丰富多彩。利用图像创建精美网页，能够给网页增加生机，从而吸引更多的浏览者。 教学重点 了解图像的格式 掌握插入图像的方法 掌握图像的超链接 内容大纲 4.1图像的格式 4.2插入图像 4.2.1插入图像标记img 4.2.2图像的源文件src 4.2.3图像的提示文字alt 4.2.4图像的宽度和高度width、heught 4.3图像的超链接 4.3.1图像的超链接 4.3.2图像热区链接 4.4练习题