网页制作探源
你想使自己成为一名专业的Web制作者吗？，那么，你应该知道自己所编辑的东西转换成HTML语言是一个什么样子，又会使用常见的HTML语法，这对于修改网页中的构件属性、添加网页特效等很有帮助，例如会在原代码中直接加入一些像JavaScript之类的东西，那你的网页制作水平才算得上是游刃有余的专业者了。
下面请跟我来探讨转换成HTML语言的网页结构及常用语法。
当用FrontPage或Dreamweaver创建一个以“教你申请专利“为标题的空白网页后，可以用鼠标点击HTML按钮（用FrontPage编辑时）或Dreamweaver启动面板上的“HTML
Source” 按钮，会显示出网页的HTML原代码，整个网页结构是以<HTML>开始，以</HTML>结束。全文如下：
<html>
<head>
<title>Untitled Document</title>
<meta http－equiv=“Content－Type” Content=“text/html; charset=gb2312”>
</head>
<body bgcolor=“＃FFFFFF”>
</body>
</html>
<head>和</head>标记之间的内容称为HTML的头部，一般不会在网页上直接显示，但插入的特效制作是可以在网页上显示的。
<title>和</title>之间的内容是Web页的标题，当浏览这一网页时，它会出现在浏览器的标题栏上。例如主页的名称是：“教你申请专利”，其原代码标记为：
<title>教你申请专利</title>
<meta>是一个非封闭类型的标记。可提供文档的关键字、作者、信息描述。在HTML的头部可以有包括多个<meta>标记。在<meta>中可以包含一些属性，如：姓名或名称name、元数据content、字符解码方式charset。有些搜索引擎使用关键字和描述进行搜索，这时你可在头部提供如下语句：
<meta name=“keywords” content=“专利，发明”>
<meta name=“description” content=“发明技巧，筹划专利申请，教你申请专利”>
<base>标记。它是用来定义文档的基础URL地址，<base>标记是惟一的，并且放在头部。它应该在任何包含URL地址的语句之前。如果希望将“教你申请专利”主页的基址URL定义为“http://jnsqzl.363.net”，则设置如下：
<base href=“http://jnsqzl.363.net”>
确定了基址URL之后，文档中所有引用的URL地址都应从基址URL地址开始。例如，文档中的一个超链接指向j/f22.htm，它实际上指向的URL地址是：http://jnsqzl.363.net/j/f22.htm
<body >和</body>用于定义HTML的正文部分。其中也可以加入一些属性，例如：指定一幅图像为背景颜色background、文本默认颜色text、超链接的文本颜色link、超链接被打开的文本颜色alink、已被访问过的超链接文本颜色vlink、文档的背景颜色bgcolor。
例如，将文档的背景设为黑色、文本设为白色、未被访问过的超链接文本设为红色、超链接正被打开的文本为兰色、已被访问过的超链接文本设为紫红色，则可使用如下<body
>标记。
<body bgcolor=“black” text=“white” link=“red” alink=“blue”
vlink=“fuchsia”>
如果在网页中使用了框架技术（Frame），则正文部分应包括在<frame>和</frame>之间，而不是在<body
>和</body>之中。
在正文中编辑文字时，HTML是以<p>和</p>标记为一个段落。例如：
<p>欢迎光临教你申请专利站点</p>
如果想在这段文字中的“教你申请专利”上作一个指向“j/index.htm”文档的超链接，其原代码可变为：
<p>欢迎光临<a href=“j/index.htm”教你申请专利</a>站点</p>
如果想用“管理员”三个字创建一个指向管理员邮箱地址的超链接，（假设邮箱地址是[email protected]）可采取如下任意一种方式：
◆ <a href=“mailto:[email protected]”>管理员</a>
◆ 如有疑问请与<a href=“mailto:[email protected]”>管理员</a>联系
◆ <p>如有疑问请与<a href=“mailto:[email protected] ?subject=我有问题”>管理员</a>联系</p>
代码在<p>和</p>之间的是自成一个文字段落，否则是置于已有的其它段落中了。带有?subject属性的，是为邮件确定了固定的主题，当你打开链接编辑邮件时，在邮件的主题栏中自动填入了“我有问题”。
在编辑正文时，常需要插入水平线、表格、图像、程序代码等。
在HTML中，水平线是由<hr>作为标记，是非封闭的。它可带有宽度width、高度尺寸size、对齐方式align、阴影效果noshade等属性，对应语句如：
<hr width=“350” size=“5” id=“Hori Rule” align=“center” noshade>
插入表格的标记为<table>和</table>。可带有宽度width、边框宽度border、单元格间的距离cellpadding等属性。举例代码如下：
<table width=“75％” border=“1” cellpadding=“2” cellpadding=“3”><tr>
<td>统计数据;</td>
<td>＆nbsp;</td>
</tr>
<tr>
<td>6590;</td>
<td>合计;</td>
</tr>
</table>
在以上例子中，有两组<tr>和</tr>标记，说明表格为2行；如果表格为2列，则在每组<tr>和</tr>标记中有2组<td>和</td>标记。在<td>和</td>之间的文字或数据，是该单元格中所填写的内容；而<td>＆nbsp;</td>表示的是该单元格中内容为空白。
在正文中插入图像，原代码是以<img>为标记的。例如要插入一幅来源于根目录下、文件名是mnd.jpg的图像，并在网页上预留85×85的空间，可使用如下语句：
<img src=“/mnd.jpg” width=“85” height=“85”>
假设插入的图像是一朵鲜花，如果浏览器不支持图像显示时，我们可以用文字“一朵鲜花”替代图像位置并显示在网页上：
<img src=“/mnd.jpg” alt=“一朵鲜花” width=“85” height=“85”>
如果我们想利用这个图像作一个指向http://jnsqzl.netsh.net的超链接，并将图像设为无边框：
<a href=“ http://jnsqzl.netsh.net”><img src=“/mnd.jpg”
alt=“一朵鲜花” border=“0”></a>
为了让鼠标移到图像超链接时显示出“大家论坛”的文字信息，可以将alt属性去掉，再为<a>标记指定title属性，语句如下：
<a href=“ http://jnsqzl.netsh.net” title=“大家论坛”><img
src=“/mnd.jpg” width=“85” height=“85”></a>
如果想单击图像链接时，让浏览器另开窗口显示链接文档，可使用如下代码：
<a href=“ http://jnsqzl.netsh.net” target=“_blank”><img
src=“/mnd.jpg” border=“0”></a>
熟悉了HTML语言网页结构，我们可以自由地在其中插入广告代码、计数器代码，镶嵌各种小程序等。
如果想用“JavaScript"语言编制一段小程序，使状态栏中显示出“欢迎光临教你申请专利站点”的走马灯文字效果，可以在html状态下，将下列JavaScript语言代码插入到主页头部的/head之后，存盘后便可预览其效果。
<script LANGUAGE=“JavaScript">
<!－－
function scroll(seed)
{
var m1 = “欢迎光临"
var m2 = “教你申请专利站点"
var msg=m1＋m2;
var out = “ ";
var c = 1;
if (seed > 100) {
seed－－;
var cmd=“scroll(" ＋ seed ＋ “)";
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 100 ＆＆ seed > 0) {
for (c=0 ; c < seed ; c＋＋) {
out＋=“ ";
}
out＋=msg;
seed－－;
var cmd=“scroll(" ＋ seed ＋ “)";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
} else if (seed <= 0) {
if (－seed < msg.length) {
out＋=msg.substring(－seed,msg.length);
seed－－;
var cmd=“scroll(" ＋ seed ＋ “)";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else {
window.status=“ ";
timerTwo=window.setTimeout(“scroll(100)",7)
;}
}
}
timerONE=window.setTimeout(‘scroll(100)',50);
//－－>
</script>
掌握了由HTML语言所反映的网页结构及常用语法之后，会使你在网页的修改和增色方面如虎添翼。