网页编程入门(完整版)（副本）.doc

网页编程入门（一）作者：吴刘平????文章来源：???????更新时间：2006-6-10??????网络技术飞速发展，互联网正在由以前所说的“走近千家万户”向“走进亿家亿户……”。网络信息主要来自各种形形色色的网站，不少网络发烧友开始追逐着建设网站的热潮。 ??网站的信息必须通过网页输出信息，于是要想通过网站发布信息，必须首先学会制作网页。谈到制作网页，可用的设计工具就太多太多了，有大家熟悉的Dreamveaver、FrontPage、Flash……不同的工具有不同的特点。 ??总体上来说，网页发布的信息主要通过以下媒体实现：文字、图片、动画、音频和视频，当然更多的是这几种方式的综合体，也就是我们常说的多媒体了（我以前听过一位领导说多媒体是会议厅里使用的电脑和投影设备，这是不对的哟，呵呵）。 ??说了这么一大堆不相干的，可能有些朋友等不急了，不是说编程吗？怎么尽是些不上叉的，别急，马上就来了…… ??为了能够对所发布的信息进行自由的控制，就需要通过编程来实现了，通过编程，我们可以实现对发布的信息进行动态控制和管理，如果学会了网页编程，我们几乎可以用任何文字编程软件都可以制网页了。 ??网页编程的道路漫长，千里之寻始于足下，就让我们从html代码开始吧（别说你讨厌代码哈，要是这样的话，你还是不要学习编程的好，因为编程从某种意义上来说，就是编写代码）。 ??下面就以大家熟悉的FrontPage为例来学习以下html编程吧！ ??先启动FrontPage(如果你的电脑里没有，那么就重新找Office光盘来安装），然后就会进入网页编辑制作界面（上部是菜单、工具栏，左边是视图区，在视图区的右边就是我们设计的主要场所了），我们会看到new_page1.htm标题（是FrontPage默认的网页文件名），在设计区的下面，有三张索引卡可供选择，默认为“普通”，另外还有“html”和“预览”两张。 ??点击一下html你就会看到你所创建网页的代码了，大致代码如下所示： html headmeta http-equiv=Content-Type content=text/html; charset=gb2312meta name=GENERATOR content=Microsoft FrontPage 4.0meta name=ProgId content=FrontPage.Editor.DocumenttitleNew Page 1/title/head body /body /html??? ??尽管是空的页面，但在代码上却有不少内容了。 ??下面解释一下html卡中所显示的代码的意思： ??html是网页的html代码的开始，在最后，有一个/html与它相对应，表示代码的结束位置，网页的所有内容都出现在这两个标记(我们把用包含起来的这部分称之为标记或标签)之间。 ??head是网页头标记，也有一个/head与之相对应，在head和/head之间，有许多定义，meta……这个标志定义的是网页的元信息（关于元信息等大家对网页有更多认识到再说，有兴趣的朋友也可以先在网上查找相关的介绍），这个我们暂时不管它，下面一个是title和/title，这是网页标题的标记，从上面的代码我们可以看到，默认的标题为New Page 1,要是我们想给页面取一个名称的话，我们就把要改的名称写到title和/title之间。 ??body和/body是网页正文的标记，基本上，网页所显示的内容全部都包含在这两个标记之间。现在我们看到的这两个标记之间什么也没有，就代表了网页是空的，…… ??我们把FrontPage文件保存（存到桌面吧，这样好打开），文件名取为：myfirstpage.htm,在后最小化FrontPage，从桌面上双击myfirstpage.htm，在浏览器中，我们就可以看到刚才的网页了（是空白的），注意打开网页的最左上方显示的是什么……（是我们刚才所介绍的title/title标签中的那个——New Page 1）。 ??从上面可以看出，在网页中的代码就就象我们写的文章一样，包括两大部分：第一是头部(head和/head之间的那部分)，第二是正文（body/body之间的那部分）。 好了，我们总算是对一个页面的总体结构搞清楚了，下面我们试着通过编程的方式修改网页的标题： ??点击任务标中的FrontPage任务，这时FrontPage变成最大化，回到我们原来的操作界面，在FrontPage中，点击html选项卡，在把title和/title之的内容改成“我的第一个编程页面”，然后保存，最小化FrontPage，刷新一下我们刚才打现在桌面上的网页（别告诉我你还不会手动刷新网页哦）。 ??再看一下浏览器的最左上方所显示的网页标题……（应