第2章　HTML语言

什么是HTML语言
　　HTML 语言是解释执行语言，就是说不需要编译，直接由浏览器解释执行。“网页”就是由这些语言代码组成的。下面我们看看浏览器怎样执行代码。
　　现在先编写个最简单的“index.htm”文件，从中分析代码的意义。
　　你的电脑显示文件的扩展名吗——就是小园点后面的三个字母，如果不显示的话，先照前一章叙述的方法设置好，以免建立成一个“index.htm.txt”文件结果你自己还不知道是什么类型。
　　打开“开始→程序→附件→记事本”，写上“我也学网页”(当然随意啦)，选择菜单“文件→另存为”，弹出对话框如下图：
　　

　　在最上行“保存在”右边的框中选择你的“学网页”目录，在最下行“保存类型”右边的框中选择“所有文件(*.*)”，在“文件名”右边的框中输入“index.htm”，击“保存”，好了，我有主页了，不信你关记事本，再双击“index.htm”这个文件名，看是不是自动启动了因特网浏览器，但他毕竟是我的网页了。
　　这个页面太简单了些啊！你告诉观众，我是正在制作，这不是已经搞好的成品。看你网易站的这个图片多好，形象地表现了你的小家还正在建设中。
　　

先在“学网页”目录下建立一个“img”目录。前面不是说目录名字不要用中文吗，你为什么建立了一个“学网页”呢？要知道这个目录里是放置所有网站文件和目录的，这个目录并上上传到到网站，他是对应网站“根目录”的。在这个目录里再建立下级目录，就要注意不要使用汉字了，所以放图片的目录我们命名为“img”。
　　把这个图片放到“img”目录里，命名为“202.gif”。然后再打开“记事本”，选择命令“文件→打开”，在这个对话框上面选择“学网页”目录，下面选择“所在文件”，选中“index.htm”，点击打开，然后写上以下代码：
　　我也学网页
　　 
　　<center>
　　<img src="img/202.gif" width="329" height="211" >
　　</center>
　　选择命令“文件→保存”，再打开“index.htm”文件，看看是不是图片出来了。图片不是在“img”目录里吗，怎么出现到页面上了？这就是浏览器的解释功能。浏览器把代码解释出来控制指令，“img”是插入图片和指令，浏览器按照“src=”后面的地址找到图片文件，就把它调出来，按照后面的定义width="329" height="211"以宽度329高度211像素显示出来。
　　“我也学网页”几个字也变了，原来输入的字是黑色的呀，现在变成红色，那是指令执行的结果。现在你知道浏览器是怎么样显示网页文件的了吧。
　　这个文件你要上传到网站，注意图片文件“*.gif”也要上传到网站上的“img”目录里。

HTML语言再认识
　　以较专业点的语言说HTML 叫做超文本标记语言(HyperText Markup Language)，透过标记式的指令 (Tag)，可用任何文本编辑器或网页专用编辑器编辑，完成后以 .htm 或 .html 为文件后缀保存。由浏览器解释，将影像、声音、图片、文字等连结显示出来。
　　HTML标记是由 < 和 > 所括住的指令所构成，由 <起始标记 >，</ 结束标记 >构成的叫双标记指令。如<center>是居中命令，但居中的文字到何处结束，必需还得一个</center>；对于不要结束标记的叫单标记指令，如换行指令 只表示从此处换到下一行，就不需要另一外“结束”指令了。
　　起始指令里面有很多特定的规则，可以设置很多参数，结束指令都较简单，只是关键字前加“/”就行。对于< 　>里面的内容，浏览器只作为指令执行，不会显示到浏览的页面上去。当然，如果写错了，浏览器不能正确解释，有时也会把它作为字符显示到页面。
　　每个网页要以<html>开始，最后有</html>表示此网页到此结束。前面试验中没有用这代码，当然浏览器也能正确执行。它的作用主要在浏览多页面时，不要让其他页中的指令带到另一页中去。
　　<html>网页开始后面常有<head>和</head>之间是文件的“头”部，“头”里面可有标题和对网页的各种设置，里面的设置只供浏览器识别，不会显示到页面。
　　以后<body>代码才是正文的开始。当然网页最后还要有</body>表示正文的结束。在<body>的尖括号内还可有背景、字体、字号、行距等格式的设置。
　　如<body bgcolor=fffef0>设置页面为淡黄色背景，
　　<body background="img/dotbg.gif">用图片“dotbg.gif”平铺背景。
　　网页中所有布局都是有指令完成的。文字的换行、分段、间隔等也都得用代码。如书写时我们用加车键换行，可用浏览器看时，文字只要没有排到到屏幕右边沿，显示时并不换行，是因为浏览器没有收到“换行”指令，而在同一行文字中，只有个 代码，浏览器就让 以后的文字换到下一行显示。如在文字间隔好多空格，浏览器显示时只间隔半个汉字的空格，需要加更多的空格必需用空格代码。我们在论坛发帖时已经注意到这一点了，明明每段前我留有空格，怎么发出来后左边都对齐了？就是因为没有空格代码。不过，现在多不用空格代码了，用成“全角”空格，浏览器就识别了。因为全角空格是汉字库中的定义，属于“汉字”，浏览器只有当做字符，不认为是空格。输入“全角”空格，就是在汉字输入状态下，单击汉字输入条中的那个“半月牙”使变成“园月”形，再打的空格就是“全角”空格。
　　对文字的设置要在中进行。在尖括号里面可以定义字体、字号、字颜色等。如就是定义了黑体字5号字，颜色(color)为红色(ff0000)。定义某段文字，要在该段文字后加结束代码，如果没有结束代码，定义将对以后所有文字有效。
　　插入图片代码，可用于“.jpg”、“.gif”、“.bmp”等图片。格式：
　　<img src="路径和文件名" align="left/right" width="宽" height="高" border="边宽" vspace="纵向间隔" hspace="横向间隔">
　　插入多媒体代码可用于“.swf”、“.mid”、“.mpg”、“.wmv”、“mp3”等文件，格式：
　　<embed src="路径和文件名" align="left/right" width="宽" height="高">
　　看了这些代码，有人说难学吧。下面试把前面的“index.htm”改一下。在“学网页”目录里再建立一个“flash”目录，里放上一个动画文件“05-3.swf”，把网页添加下面代码，看看效果。
　　<embed src="flash/05-3.swf" width="400" height="300">