攀枝花市经贸旅游学校
教  案
2011 ～2012 学年第二学期
课 程 名 称：
计算机网络基础
授 课 班 级：
2010级4asp是动态网站开发工具班
主 讲 教 师：
刘乐平
使 用 教 材：
计算机网络基础

第5章　HTML语言入门
课 　型：　新课
课时安排：18课时
教学目标：
知识目标：1)理解网页与网站的概念；
2)掌握HTML文件的基本结构；
3)掌握HTML文件编辑的常用标记；
4)掌握列表标记的应用；
5)掌握超链接标记的应用；
6)掌握表格标记的应用；
7)掌握表单和框架技术的应用；
8)掌握多媒体在网页中的应用；
9)掌握CSS在网页中的应用；
技能目标：培养学生运用所学知识与技能，主动探究，解决实际问题的能力。
德育目标：培养大家养成勇于探究新知识，不断地提高自身的审美意识，树立正确的人生观和价值。
教学重点：HTML、 列表标记、超链接标记、表格标记、表单和框架技术、CSS
教学难点：标记的使用与运用
安全教育：培养学生网络安全意识
教学方法：讲演练
教学过程：
第1,2课时
5.1  网页制作概述
一、网站
网站(Website)是指在Internet上，使用HTML(Hypertext Markup Language,超文本标记语言)
等工具制作的用于展示特定内容的相关网页集合。
1．网站类型
网站类型是指根据网站使用性质和内容的不同对网站的分类，通常情况下可以将网站分为政府网站、商业网站、企业网站、教育科研机构网站、个人网站和其它非盈利机构网站等。
2．网站结构
网站结构一般分为物理结构和逻辑结构，网站物理结构是指网站真实的目录及文件所存储的位置；网站逻辑结构是指在一个网站中各页面之间的逻辑链接关系，也可称为网站地图。
常见的网站逻辑结构有以下三种：
(1) 线性结构：这是网站最简单的一种结构，它是以某种顺序组织的，可以是时间顺序，也可以是逻辑甚至是字母顺序。通过这些顺序呈线性地链接。如一般的索引就采用线性结构。线性结构是组织网页的基本结构。
(2) 二维表结构：这种结构允许浏览者横向、纵向地浏览信息。
(3) 层次结构：层次结构是由一条主线构成索引，每一层又由一条线性结构构成。如网站导航就是这种结构。层次构造是目前网页制作普遍采用的一种结构形式。
二、网页
网页是网站中的“一页”，是构成网站的基本元素，是承载各种网站应用服务的平台。就是当浏览者访问网站时，在浏览器窗口中所看到的一个个页面。其中，在浏览器窗口中首先打开的默认页面称为该网站的首页或主页(Home Page)，网站首页一般命名为index或default。
1．网页文件的类型
网页是以文件的形式存储的网页文件。
以.htm或.html为后缀的文件，俗称HTML文件。
不同的后缀，分别代表不同类型的网页文件，如以.asp或.aspx或.php或.jsp等为后缀的网页文件。
2．网页的分类
网页按使用技术的不同，一般分为静态网页和动态网页。
静态网页是相对于动态网页而言的，是指没有后台数据库、不含程序和交互操作的网页。采用纯HTML来编写。插入.gif格式的动画、FLASH动画、滚动字幕等可实现视觉上的动态效果。
动态网页可以实现网页浏览者和网页设计者的交互，实现交互技术有两种：一种是客户端技术如常用的JavaScript和VBScript；另一种是服务器端技术如目前常用的ASP和PHP。它们会随不同浏览者、不同时间、不同操作返回不同的网页，例如ASP、PHP、JSP、ASP、CGI等；
★客户端脚本语言
JavaScript：由网景公司的Brendan Eich设计，是一种动态、弱类型、基于原型的语言，内置支持类型广泛用于客户端网页开发的脚本语言，最常是于HTML上使用，用来给HTML网页添加动态功能。
VBScript是微软开发的一种脚本语言，可以看作是VB语言的简化版，
★动态网页技术：
ASP （Active Server Pages）：动态服务器网页，由微软公司开发的服务器端运行的脚本平台，它被Windows下Internet Information Services (IIS)的程序所管理。
PHP （Hypertext Preprocessor）：由拉斯姆斯·勒多夫在1995年发明，是一种在电脑上运行的脚本语言，主要用途是在于处理动态网页，也包含了命令行运行接口（command line interface），或者产生图形用户界面（GUI）程序。[1]
JSP （Java Server Pages）：由Sun Microsystems公司倡导和许多公司参与共同创建的一种使软件开发者可以响应客户端请求，而动态生成HTML、XML或其他格式文档的Web网页的技术标准。JSP技术是以Java语言作为脚本语言的，JSP网页为整个服务器端的Java库单元提供了一个接口来服务于HTTP的应用程序。
2．构成网页的元素
网页的基本要素一般包括：文字、图像、动画和链接标志等，除此之外，网页的元素还包声音、多媒体和视频等。
文本：是网页中最基本的元素。网页中文字的设计一般从以下几个方面来考虑：
◆   字体的选择。
◆   字号、行距的选择。
◆   特殊字体的使用。
◆   字体的颜。
图像：现在网络上使用的绝大多数图片和图像是gif、jpeg和png文件格式。
网页上使用图像要注意的问题：
◆ JPEG格式适合于照片图像，GIF格式适合于包含纯的图像，例如插图和线条图。
◆ 利用图像编辑软件来放大或缩小图像
◆ 屏幕显示图像的分辨率一般为72dpi。制作图像时，不必使用比此再高的分辨率。尝试各种不同的JPEG压缩率
◆ 使用合适的彩模式。
◆ 慎用动画
链接：也叫超链接（Hyperlink），是从一个网页指向另一个目的端的链接，是页面间的链接关系。
◆ 链接标志（载体）指的是网页中特殊的文本或图像，它们常常用不同的颜和下划线来标识，在浏览器中，访问者可以用鼠标单击它们，能够从当前的网页转到链接的目的端位置。
◆ 超链接的标志一般有：文本、图像、热区三种。
除上述几种要素之外，在网页上经常使用的还有动画、视频、声音等各种信息的形式。
动画：目前网络上常用的动画类型有gif和Flash动画两种。
视频：是多媒体网页的一个重要组成部分，常用的视频格式有avi、mpeg，.rm和mov等，视频会大大增加网页的文件量，从而使用访问速度受到影响，因此要慎用（严禁喧宾夺
主）。
音频：在网页中插入音频会增加网页的生动性。常用的音频格式有rm(ram)、midi、wav和mp3等格式。音频文件和视频文件一样都会增加网页的文件量，因此要慎用。
3．网页布局形式
(1)“国”字形布局：也可称为“同”字型。
(2)“匡”字形布局
(3)标题文本型布局：标题文本型布局是指页面内容以文本为主，
(4)框架型布局：采用框架布局结构，常见的有左右框架型、上下框架型和综合框架型。
还有综合型布局、封面型布局、海报型布局、Flash型布局等，
网页布局一般都采用表格布局法，还可使用框架布局法和层叠样式表布局法。
4．网页制作工具
①网页编辑工具
超文本标识语言HTML（Hyper Text Markup Language）全称是超文本标记语言，利用标记来描述网页的字体、大小、颜及页面布局的语言，使用任何的文本编辑器都可以编辑HTML文档。是一种专门用于Web页制作的语言，用来描述超文本各个部分的内容，告诉浏览器如何显示文本，怎样生成与别的文本或图像的链接点。
FrontPage是非常受初学者欢迎的一种，是一种非常容易上手的工具。它是由微软开发，并己集成为Office的组件之一，与Microsoft Office应用程序的无缝集成。
Macromedia公司开发的Dreamweaver软件是一种专业的网页编辑器，用于对站点、网页和Web应用程序进行设计、编码和开发。可直接编写HTML代码还可以在可视化编辑环境中工作
②网页图像编辑工具
Photoshop：是Adobe公司开发的，是当今最流行的图形图象处理软件之一，它能够实现各种专业化的图像制作、处理及合成。
Fireworks：是由Macromedia公司开发的图形处理工具，它是第一个专门为制作网页图形而设计的软件，同时也提供专业的网页图形设计及制作的解决方案。
Flash：Macromedia公司出品的Flash是目前非常流行的一种交互式Web矢量动画软件。
Dreamweaver和Flash、Fireworks三个软件被称为“网页三剑客”，是现在公认的比较标准的网页制作利器。
第3,4课时
5.2  HTML初步
一、HTML的概况
HTML  (HyperText Markup Language) 超文本标记语言，是用特殊标记(tag)来描述文档结构和表现形式的一种语言。使用HTML语言描述的文件，需要通过Web浏览器显示出效果。即浏览一个网页时，实际上是把该网页所对应的HTML文件下载到我们的计算机中，然后由本地计算机中的浏览器来解释。
HTML发展：
由蒂姆·伯纳斯-李给出原始定义，由IETF用简化的SGML（标准通用标记语言）语法进行进一步发展的HTML，后来成为国际标准，由万维网联盟（W3C）维护。
超文本置标语言（第一版）——在1993年6月作为互联网工程工作小组（IETF）工作草案发布（并非标准）：
  HTML 2.0——1995年11月作为RFC 1866发布，在RFC 2854于2000年6月发布之后被宣布已经过时
  HTML 3.2——1996年1月14日，W3C推荐标准
  HTML 4.0——1997年12月18日，W3C推荐标准
  HTML 4.01（微小改进）——1999年12月24日，W3C推荐标准
ISO/IEC 15445:2000（“ISO HTML”）——2000年5月15日发布，基于严格的HTML 4.01语法，是国际标准化组织和国际电工委员会的标准。
HTML 5目前仍为草案，并已被W3C接纳。
★XHTML（可扩展超文本标记语言）是W3C计划中的HTML的接替者。是一个独立的、和HTML平行发展的标准。W3C目前的建议是使用XHTML 1.1、XHTML 1.0或者HTML 4.01进行网络出版。
★动态HTML（Dynamic HTML，简称DHTML、DHML）是一种通过结合HTML、用户端脚本语言（Client Side Script，如JavaScript）、串接样式表（CSS）和文件物件模型（DOM）来创建动态网页内容的方法

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。