加载中…HTML 是超文本标记语言（HyperText
Markup Language）的缩写 ，是一种用来在WWW（World Wide
Web）上表示信息的语言。目前，HTML已有各种版本，我们给大家介绍的是3.0
版 。?TML
编写的超文本文档称为HTML文档，它适用于各种操作平台，如UNIX，WINDOWS
等。 8{1S
HTML文档实际上是一种带有标记（Tags）的文本文件，其扩展名通常它为.htm 或 .html。HTML语言是通过各种标记来标识文档的结构和超链（Hyperlink）的信息。但是，请大家注意，尽管我们可以?TML 语言描述文档的结构，但却无法精确地定义文档的实际表现形式，而只是建议Web 浏览器（ 如IE、Mosiac、Netscape）应该如何显示和排列这些信 息，在用户面前的最终显示结果取决于Web浏览器本身的显示风格及其对标记的解释能力。因此同一HTML文档在不同浏览器中展示的效果可能会不一样。 -!
生成一个HTML文档通常可以通过以下四种途径： h
1． 利用各种文本编辑器（如Windows记事本）直接使?TML语言编写； N
2． 借助一些HTML 的编辑工具，如FrontPage、HotDog等； 1=Af
3. 由其它格式的文 档（ 如WORD 文 档）转换成HTML 文档； VKnT
4. 由Web 服务器端实时动态地生成。 !
下面，我们针对第一种途径，围绕本书ASP文件中所使用的一些HTML文档，给大家做一简单介绍： "
A.2 标记语法和文档结构 6
HTML的标记总是封装在由小于号（<）和大于号（>） 构成的一对尖括号之中。 Kgw
A.2.1单标记 j(
某些标记称为“单标记”，因为它只需单独使用就能完整地表达意思，这类标记的语法 是： |vkH
< 标 记> ^4S
例如：后面要讲的换行标记<BR>就是一个单标记。 2F
A.2.2双标记 a>fKV
另一类标记称为“双标记”，它由“ 始标记”和“尾标记”两部分构成， 必须成对使 用，其中始标记告诉Web 浏览器从此处开始执行该标记所表示的功能，而尾标记告诉Web浏 览器在这里结束该功能。始标记前加一个斜杠（/）即成为尾标记。这类标记的语法是： 40X{
< 标记> 内容 </ 标记> 5p
其中“内容”部分就是要被这对标记施加作用的部分。例如你想突出对某段文字的显示，就将此段文字放在一对<EM></EM>标记中： i
<EM>text to emphasize</EM> `
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ "QapKC
A.2.3文档结构 c_o`
通常由三对标记构成一个HTML文档的骨架，它们是： O&p<,
<HTML> T
<HEAD> Y+
头部信息 b+za2
</HEAD> Bs|P9
<BODY> Ukc1w
文档主体，正文部分 ^y
</BODY> {f/Y+
</HTML> wO`r
其中<HTML>在最外层，表示这对标记间的内容是HTML文档。<HTML>标记也可以省略，因为.html或.htm文件被Web 浏览器默认为是HTML文档。<HEAD> 之间的内容包括文档的头部信息， 如文档总标题等，若不需头部信息则 可省略此标记。<BODY> 标记表示正文内容的开始。 X'8g
A.2.4文档基本属性的确定 s
在<BODY>标记中可以确定整个文档的背景色、前景色等基本属性。 )
语法： g|D0+%
<BODY [BGCOLOR|TEXT|LINK|ALINK|VLINK|BACKGROUND]> S:O
文档主体 p40
</BODY> fPJ
其中， jix.\I
BGCOLOR：HTML的背景色 gCQFHu
TEXT：指定HTML文件中文字色彩属性 {N
LINK：指定HTML文件中待连接超连接对象色彩属性 |Q4A{V
ALINK：指定HTML文件中连接中超连接对象色彩属性 }
VLINK：指定HTML文件中已连接超连接对象色彩属性 VYJv:T
BAKGROUND：指定HTML背景图形。 3hHY.R
例子： pg$^4"
<HTML> zyhF
<BODY BGCOLOR="FFFFFF" TEXT="#000000" LINK="0000FF" BZ4a
BACKGROUND="TEST.GIF"> 6:K
</BODY> Cs(
</HTML> a
上面实例表示文档背景色为白色，超连为蓝色，文字为黑色，并使用TEST.GIF图片做背景图。 bre
各属性的参数值可以是用英文描述的颜色如 “RED”、“BLUE”、“YELLOW”等，也可以是RGB值（见表A-1）,共6位，每种颜色两位从00到FF。如红色可以表示为“ff0000”，蓝色可以表示为“0000ff”等。 k*
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ e6R
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ ;Xd~
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ K<n
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ BL4<
A-1 各颜色与对应的RGB值 pwYI%
颜色 RGB值 颜色 RGB值 y>9k
黑色（BLACK） 000000H 黄色(YELLOW) FFFF00H >sUE
白色（WHITE） FFFFFFH 石灰色(LIME) 00FF00H L1{
绿色（GREEN） 008000H 水绿色(AQUA) 00FFFFH h)1Mm
褐红色(MAROON) 800000H 紫红色(FUCHSIA) FF00FFH x1{S
橄榄色(OLIVE) 808000H 银白色(SILVER) C0C0C0H }A%Fz
藏青色(NAVY) 000080H 红色(RED) FF0000H BhN2N
紫色(PURPLE) 800080H 蓝色(BLUE) 0000FFH '))t2
灰色(GRAY) 808080H au
A.3.1 注释标记 WfEFC
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ Gs
该标记用于书写文档源文件的注释，是一个单标记，注释内容在浏览器中不显示。格式为： FC
<!-- 注 释 内 容 --> kFLP%(
A.3.2 文件标题（<TITLE>|</TITLE>） %Qz9
<TITLE>和</TITLE>之间的部分，就是这一个HTML文档的总标题，它一般出现在<HEAD>标记中。文件标题一般会显示在Web浏览器最上面的标题（Title）栏的位置。用户可以把它加入BOOKMARK中。 TIbg
A.3.3 题头（<H>|</H>） C+CWe
题头标记有6种，分别为H1, H2,…H6，用于表示文章中的各种题目。标题号越小，字体越大。 2Oe2&
题头标记可以有对齐属性，align＝#，#可以为以下各值： 00uYH-
left 表示标题居左 f/C6
center 表示标题居中 >,
rigHt 表示标题居右 C
例如： <H2 align=center>CHapter 2 </H2> ?9r
A.3.4 段落标记（<P>） $]njO
HTML浏览器是基于窗口的，用户可以随时改变显示区的大小，所以HTML将多个空格以及回车等效为一个空格，这是和绝大多数字处理器不同的。HTML的分段完全依赖于分段元素<P>。例如： /lt
<H2>This Is a Level Two Heading</H2> s;9*
paragraph one <P> g-`-
paragraph Two <P> ze
<P>也可以有多种属性，比较常用的属性是： G+y
aligh＝#，#可以是left,center,right,其含义同上面的题头。 )"H~1t
A.3.5 换行标记（<BR>） Z
换行标记<BR>是一个单标记。这个标记用来标识一个换行动作。在HTML文件中可以用它来调整行间距。 O/2
A.3.6 横线标记（<HR>） .
横线标记一般用于分隔同一文体的不同部分，在窗口中画出一条水平横线，线的宽度和高度是可调的。这个标记对于美化页面是比较有用的。它的属性是ALIGN、WIDTH、SIZE分别用于调整线的位置和宽度。ALIGN的参数和题头、段落标记中的类似，也有RIGHT、CENTER、LEFT。WIDTH可以用百分数表示也可以用绝对值指明。 kl7
例如： "r
<HR width=50> 、<HR width=50%>。 k|u
A.3.7 有关字体标记（大小、风格、颜色、闪烁） U
1． 字体大小 @7#yia
HTML有七种字号，1号最小，7号最大。缺省字号为3，可以用<FONTSIZE=字号>来设置缺省字号。 O,\-
设置文本的字号有两种办法，一种是设置绝对字号，< FONT SIZE =字号>；另一种是设置文本的相对字号；< FONT SIZE =±n>。用第二种方法时“＋”号表示字体变大，“－”号表示字体变小。例如： T#tN,}
< FONT SIZE =7>Today is fine!</FONT> (%w
2. 字体风格 k
字体风格分为物理风格和逻辑风格。物理风格直接指定字体，物理风格的字体有<b>黑体，<i>斜体，<u>下划线，<tt>打字机体。逻辑风格指定文本的作用。如：<EM> </EM>突出显示（Emphasize），它并不指明怎样突 出法，而让Web 浏览器自行决定，大多浏览器就把它处理为斜体（等效于<I></I>）。类似的逻辑型标记还有： 0
<SRTONG></STRONG> 重点突出显示（Strong emphasize） cA{T
<ADDRESS> </ADDRESS> 按地址类型显示 /%rgi
<CODE> </CODE> 按代码类型显示， 等等。 9t=
例如：您可以使用下面语句通知浏览器以突出显示的方式显示字符串“Today is fine!” /4dsXC
<EM> Today is fine! </EM> F/Vnbk
3. 字体颜色 Lkcb(
字体的颜色用<FONT color=#>指定。其中，#参数值可以是用英文描述的颜色如 “RED”、“BLUE”、“YELLOW”等，也可以是RGB值（参见前面表A-1）。 Sp
4. 字体闪烁 ^I9g
<BLINK>文本</ BLINK >使文本闪烁，闪烁频率为１秒钟一次。 ])Lx
A.3.8 预编排文本（<PRE>） icN
HTML的输出是基于窗口的，因而HTML文件在输出时都是要重新排版的，若确实不需要重新排版的内容，可以用<PRE>…<／PRE>通知浏览器。浏览器在输出时，对这部分内容几乎不做修改地输出，输出的字体电传打字机字体。例如： 3}=
<PRE> I
please use your card. OXoA
VISA Master v$u"\7
<B>Here is an order form.</B> !tJ0P5
<ul><li>Fax ~
<li>Air Mail </ul> d
</PRE> zP5zE
A.3.9 居中（<CENTER>…<／CENTER>） 2tZXQX
很多标记都有对齐方式属性，如<H>、<P>等。也可以直接用居中链接签<CENTER>…<／CENTER>。例如： &t
<CENTER> 6_g60
This must be my dream. lg
<／CENTER> le6'O
A.3.10 清单标记（List） oI)
清单用于列举事实，常用的清单有3种格式，即无序清单(unordered List)，有序清单(ordered list)和定义清单(definition list)。 '}_1x
1.无序清单(UL) t;y4E
无序清单用(UL)开始，每一个清单条目用<LI>引导，最后是</UL>，注意清单条目不需要结尾链接签</LI>。输出时每一清单条目缩进，并且以黑点标示。例如： iu
<UL> 3
<LI>Today }:JyW)
<LI>Tommorow ceWZE?
</UL> O=gy
输出为 qP0u5
●Today ~[:[?g
●Tommorow r;No
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ sN{
2．有序清单<OL> ^$J
有序清单与无序清单相比，只是在输出时清单条目用数字标示，下面是一个例子及其输出。例如： }wc
<OL> $ytppr
<LI>Today [o
<LI>Tommorow cmlN-\
</OL> jP6E5
输出为： G
1.Today y
2.Tommorow VbPf
3. 定义清单<DL> ~FTfV
定义清单用于对清单条目进行简短说明的场合，用<DL>开始，清单条目用<DT>引导，它的说明用<DD>引导。例如： /Q|<5,
<DL> 8f
<DT>Item 1 .[BG
<DD>The definition of item 1 7L+!c
<DT>Item 2 A><
<DD>Definition or explaination of item 2 !kj+
</DL> H
输出为： Q
Item 1 \TqC
The definition of item 1 {.fE
Item 2 bym<Xe
Definiton or explaination of item 2 X+4
A.3.11 URL和超链 ?1b<
创建一个超链（Hyperlink）是HTML语言中的一个重要部分。一个超 链又称作锚（Anchor），它唯一地指向另一个Web信息页，超链如同把Gopher 中可触发的菜单项融于正文之中，因此超链更具有上下文的含义。 p
1.URL 格 式 y+o]
一个Web信息页是用URL（Universal Resource Location，统一资源定位器）来唯一标识的，URL的一般格式为： %"*
访问方式：//服务器域名/路径及文件名 B7Aa@
其中访问方式可有HTTP、FTP、TELNET、GOPHER、WAIS、NEWS、MAILTO、FILE等等。随着访问方式的不同，冒号后面的参数格式也会不同，下面是一些URL的例子： $
http://www.ecnu.edu.cn/coliege/science/computer/computer.htm B!n<$N
ftp://ftp.sjtu.edu.cn/pub/ q
mailto:webmaster@www.ecnu.edu.cn 590h<
<I>file:</I>///c|/html/sample.htm _;H
2．跳转至另一篇文章 Ixl
HTML文章的另一个特色，就是在文章段落间任意地跳转。可以跳到另外一台机器上的文件，也可以跳到文章的另一个段落或本机的另一片文章。下面是它标注的格式。基本上，它会是这一个样子： rgY>
<A href="URL" >Link to filename </A> BV
在浏览器中，我们将可以看到“Link to filename”会变色并加下底线，当鼠标移到上面时，会从箭头转成手指，这表示你可以在这儿用鼠标按一下：会跳转到URL地址框中所指定的文档中。 !7Lj#1
例如：想连结中央电视台，可以写成下面那样： 8
<A HREF="http://www.cctv.com.cn/ ">中央电视台</A> I
3. 跳转至另一个段落 i
除了跳到另一个HTML文件，也可以在一篇文章内随心所欲地跳转。首先看看它在“”引号中的表示方式 LH!`
<A HREF="#clients">Jump to Clients </A> z?SgR
同样，在浏览器中当鼠标移到“Jump to Clients”上面时，会变成手形，当我们单击鼠标时就会连接到文档中有标注<A NAME= "clients"> Clinets </A>的地方。 L.<sL
如果这两个标注是在不同的文件内，则表示方法有点儿改变。若Jump to Clients 在A文章，而Clients 在B文章中，则要改成 pb
<A HREF="filenameB#clients"> Jump to Clients </A> m
这样一来，当我们在A文章中点Jump to Clients 时就会跳到B文章的Clients这个字的位置，而不是B文章中的其它地方。 ]
A.4 图像、声音、视频和动画 v$O
HTML文档的另一个重要特性就是能把多媒体信息综合在一起，使显示 的信息更加多姿多彩。 [2 {~
A.4.1 图像 _Mr j
HTML支持内嵌式的图像显示。HTML 的图像标记是一个单标记，它的格式为： 55E_
<IMG SRC="URL 信 息"> =1'
其中属性SRC 表示图的源（Source）文件，因此这里的URL信息必须 对应一个图像文件。目前有以下几种图像的格式能被Web浏览器直接解释：GIF 格式（.GIF 文 件， 支 持256 色）；位图文件；JPEG 格式（.JPG、.JPEG 文件 ，支持RGB色）。 .-'96"
对于段落中的图像，还可以利用ALIGN 属性定义图与文本行的对齐方 式，其属性值可取TOP（ 与文本行顶部对齐）、MIDDLE（ 中间对齐）、 BOTTOM（ 底部对齐， 默认值）、LEFT（ 将此图显示在窗口左方）、RIGHT（ 将此图显示在窗口右方）。 例 如： +O'
<H2><IMG ALIGN=MIDDLE SRC="boat.gif"> This middle-align.</H2> T
如果您不满意图像的原始尺寸，可以用属性WIDTH 和HEIGHT分别重新定义图像的宽度和高度，属性值为用整数表示的屏幕像素点的个数。 cLr'x}
如果您想让图像单独占一块区域，不要忘了在图像标记的前后加上<P> 或<BR> 标记。例如： )]?)6
<P><IMG SRC="revbar.gif"><P>stand alone with the text.<P> y
图像同样也可以作为一个超链，例如： *6P$
<A HREF="detail.htm"><IMG SRC="model.gif">Click the image </A> 4
Web浏览器在超链图像的四周画一个边框，以示可被触发。若想去掉这个框只需在<IMG>中加上属性BORDER=0 就可以了。 %C]Y
A.4.2 声音和视频 $P
Web 浏览器自身不能解释声音和视频文件，但它能通过其它辅助工具的帮助来播放声音和视像文件。一般声音文件带有.WAV、.AU、.SND等文 件扩展名，而视频文件带有.AVI、.MPG等文件扩展名。要播放这些文件， 就必须把这些文件作为一个超链中的URL信息。当用户触发这一超链时，Web浏览器发现自己无法解释这类文件，就在辅助工具表中启动相应的程序来播放它们。例如： NA
<H2>Here is the <A HREF="demo.avi">video demo</A>.</H2> R"~n
当用户触发video demo的超链后，Web浏览器立即启动mplayer程序 来播放demo.avi视像文件。 aTC
A.4.3 动画 h
SUN公司开发了一套称为Java的通用程序设计语言，利用它制作的Homepage可支持内嵌式的动画和内嵌式的声音。 您可以用SUN公司的Web 浏览器HotJava 来观看带有Java标记的 Homepage。 U]ha,
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ /9
A.5 表格（Table） QA#~
Table是一种用来描述表格信息的新结构，它是HTML3.0中的一个重要内容。 U\X/
A.5.1 一 个Table 实 例 '
Table往往是由一个表格名称再加上一行或多行的表格内容所构成块状结构。表格的每一行内又由一个或多个表项单元组成，并且表项单元还可以按照行或列的方式结合在一起，成为一个大的表项单元。下面我们先 来看一个Table实例： 7WcH]E
<TABLE BORDER=2 WIDTH=300 bgcolor=#ffffffff> ,_ha@
<CAPTION>一个表格实例</CAPTION> v1
<TR> ZNjx
<TH>学号 [K
<TH>姓名 q@8
<TH>性别 tqz
<TH>年龄 Zx
</TR> ^
<TR> N_D#[
<TD>01 v%|
<TD>郭海平 4
<TD>男 IH<Sw
<TD>19 sW
</TR> {
<TR> ar
<TD>02 iP=R
<TD>王燕 &Lr*\
<TD>女 Qi|>=;
<TD>18 H
</TR> fK&8
</TABLE> $<G/
下图是这一实例的显示效果： V
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ qo%
A.5.2 Table 元素 :
下面我们就根据上面的实例来分析一下Table中的各个元素： 8j|
1．<TABLE> 表 格 内 容 </TABLE> AK%3i
一对<TABLE>标记是一个Table结构的最外层，它主要包括三个重要属 性。一个是用来表示表格边框粗细程度的属性BORDER，属性值取整数，如果省略BORDER属性，则表示不加边框。另一个是用来表示表格宽度的属性WIDTH，其属性可取相对值(表示相对于充满窗口的百分比，WIDTH=30%），也可取绝对值（用整数表示的屏幕像素点的个数），缺省值是"100%"。还有一个属性是CELLPADDING，用来表示每个表项单元的内容与表格边框之间所空开的距离，用屏幕像素点为单位，缺省值是0。 =]$W
2．<CAPTION> 表 格 名 称 </CAPTION> \cJV.$
在一对<CAPTION>标记中是这张表格的名称信息，它通常被Web浏览器 显示在表格上方的中央部位。 &au}!
3．表格颜色 b%
表格的颜色用bgcolor=#指定。其中，#参数值可以是用英文描述的颜色如 “RED”、“BLUE”、“YELLOW”等，也可以是RGB值（参见前面表A-1）。例如： /
<table border> T"
<tr> p_[]
<th bgcolor=000000><font color=ffffff>Food</font></th> T
<th bgcolor=whit>Drink</th> #-_
<tr><td bgclor=ffaaaa>A</td><td>B</td> Z
</table> r[m3e-
4．<TR>表 格 当 前 行 的 内 容 ioE0
单标记<TR>表示一个新的表格行（Table Row）的开始。 h:]~G
5．<TH>表项标题内容，<TD>表项数据内容 D7h8f
单标记<TH>和<TD>都表示在表格的当前行里产生一个新的表项单元。其中<TH>表示一个表项标题（Table Header）单元，而<TD>表示一个表项 数据（Table Data）单元。Web浏览器一般把<TH>中的文本用粗体表示。 每个表项单元（<TH> 或<TD>）都可带有表示横向对齐方式的属性ALIGN，属性的取值范围主要有LEFT，CENTER，RIGHT等，其中<TH>的缺省值是LIGN=CENTER，<TD>的缺省值是ALIGN=LEFT。另外还有表示纵向对齐方式的属性 VALIGN，属性的取值范围主要有TOP，MIDDLE，BOTTOM 等，其中<TH> 和<TD>的缺省值都是VALIGN=MIDDLE。 nKkr'y
A.5.3 表的通栏 I!
1.有横向通栏的表用<th colspan=#>属性说明。colspan表示横向栏距，#代表通栏占据的网格数，它是一个小于表的横向网格数的整数。 5|9
2.有纵向通栏的表用rowspan=#属性说明。rowspan表示纵向栏距，#表示通栏占据的网格数，应小于纵向网络数。 1
需要说明的是有纵向通栏的表，每一行必须用</tr>明确给出一横向栏目结束,这是和表的基本形式不同的。下面这个实例就是一个有通栏的表格： ztBA
<TABLE BORDER=3 WIDTH=300"> %|=rf
<CAPTION>一个有通栏的表格</CAPTION> b8sI
<TR><TH ROWSPAN=2><TH COLSPAN=2>平均值 de
<TH>其他<TH>杂项 _9rKe\
<TR><TH>重量<TH>重量 xa
<TR><TH ALIGN=LEFT>雄性<TD>1.9<TD>0.003 .;Y
<TR><TH ALIGN=LEFT ROWSPAN=2>雌性<TD>1.7<TD>0.002 KC
</TABLE> g6
下图是这个实例在IE4.0浏览器中的显示效果： s!4
A.6 表单 {TyT5
通过表单可以增强网页的加交互能力。网页（Homepage）并非只是给人观看的信息页，有时还需要获取用户的反馈信息，并且Web服务器根据得到的反馈信息还要给用户作出相应的回答。HTML中的form结构就是专为提供这种交互界面而设计的。form结构也是一张表。它与Table表的区 别在于：Table表是给用户看的，而form表是让用户填的。因此form表又有其特殊的组成元素。 AjC}
A.6.1 一个表单实例 ?jy2Yo
下面HTML文档是一个表单： AV#;w
<HTML> joN[9
<HEAD><TITLE>form集合的用法</TITLE></HEAD> 6*cVH8
<BODY BGCOLOR="#FFFFFF"> qH
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ >_d
<H4>***信息港免费用户注册登记页</H4> *L{4aX
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ hP&3G&
<form method="POST" action="2-1.asp" > o]`VWP
姓名：<input name="username" type="text" size=16><br> 0
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ N'Lt
性别：<input name="gender" type="radio" value="男" checked>男 -)
<input name="gender" type="radio" value="女">女<br> ,4[2o
学历： LCX\~H
<select name="knowledge" > .
<option>初中 =
<option>高中 {}x(X[
<option>专科 RKr=8%
<option selected>大本 +a
<option>研究生 !vpd
<option>博士生 +q>oP
</select><br> b*T
E-mail：<input name="e-mail" type="text" size=16><br> 2^*
爱好：<input name="hobby" type="checkbox" value="文学">文学 Z3uhNb
<input name="hobby" type="checkbox" value="体育">体育 "
<input name="hobby" type="checkbox" value="音乐">音乐 z@64y
<input name="hobby" type="checkbox" value="??quot;>??lt;br> (BTc:
<br><br> l"
<input type=submit value="提交"> r~m<
<input type=reset value="取消"> m
</form> 6
</BODY> L: .
</HTML> A
其在IF4.0浏览器中的运行结果如下?荆?E1!=j<
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ !8
A.6.2 表单（form） 元素 >j,H
下面我们就来结合上面的实例简要介绍一下form 表单中的常用元素： )_=
1. <form ACTION= "URL 信息" METHOD= 数据传送方法> GK{
form表内容 XwC
</form> mC2
一对<form>标记是一个form 表单的最外层。form表单不允许嵌套，也就是说一个form中不可以再包含其它form。其中ACTION属性表示用户提交表格时所要启动的相应处理程序。在HTTP中必须是一个EXE可执行文 件。METHOD属性表示怎样将数据传送给Web服务器，一种是GET方法（也 是缺省方法），它将数据附加在URL信息上传送给Web服务器；另一种是POST方法，它将数据独立成块地传送给Web服务器。如果传送数据量大的 话，还是建议用POST方法，因为多数Web服务器的GET方法是通过命令行参数来传递数据，而命令行参数的长度是有限的。 D~`>
2.<INPUT TYPE= 输 入 方 式> Oy="2
单标记<INPUT>代表输入元素，根据TYPE值的不同，又各自有一套特殊的属性。具体如下： L}y6$;
（1）<INPUT TYPE=TEXT NAME="变量名"> y,n09
表示单行文本输入框，NAME属性表示此文本框的变量名，它将与用户填入文本行中的数据一起交给Web服务器。其它可选属性还有SIZE（输入 框显示的长度），MAXLENGTH（输入的最多字符数），value（文本框内的初始值）。 PM
（2）<INPUT TYPE=RADIO NAME="变量名" value="值名"> JE|24
表示一个单选按钮，NAME属性表示这一组按钮的变量名，value属性 是此组按钮中这一按钮值的名称。可选属性还有CHECKED（表示被初始选中）。 ?c
（3）<INPUT TYPE=CHECKBOX NAME="变量名" value="值名"> VT+tG
表示一个复选框，可选属性还有CHECKED。 fq
（4）<INPUT TYPE=SUBMIT>和<INPUT TYPE=RESET> 3J;\
分别表示发送按钮和取消按钮。当用户填完表格后，按了SUBMIT 按钮就表示要发送数据，按RESET按钮就表示要取消并清除所填内容，回到初始状态。可选属性还有value（表示按钮的标题内容）。 #0t
3.<SELECT NAME= 变 量 名> 2
各 选 项 yK
</SELECT> 3E+xGZ
一对<SELECT>标记表示一个选择框。可选属性还有SIZE（如果SIZE=1或省略此属性，则Web浏览器将它显示为一个组合框；如SIZE值大于1，则显示为一个列表框，并且列表框中一次显示的项数为SIZE 的属 性值），MULTIPLE（表示可以复选）。 !^
4.<OPTION> 选 项 内 容 2L\[S[
单标记<OPTION>必须在一对<SELECT>标记中使用，表示具体的选项。可选属性还有SELECTED（初始选中），value（选项值名，缺省值为"选项内容"）。 XGKh7J
5.<TEXTAREA NAME=" 变量名"> DU}uy>
初 始 值 ^~9X
</TEXTAREA> Q
一对<TEXTAREA>标记表示一个多行文本输入框，其中"初始值"为显示在文本框中的初始内容。可选属性还有ROWS（显示几行），COLS（信息几列）。 _+
HTML文档实际上是一种带有标记（Tags）的文本文件，其扩展名通常它为.htm 或 .html。HTML语言是通过各种标记来标识文档的结构和超链（Hyperlink）的信息。但是，请大家注意，尽管我们可以?TML 语言描述文档的结构，但却无法精确地定义文档的实际表现形式，而只是建议Web 浏览器（ 如IE、Mosiac、Netscape）应该如何显示和排列这些信 息，在用户面前的最终显示结果取决于Web浏览器本身的显示风格及其对标记的解释能力。因此同一HTML文档在不同浏览器中展示的效果可能会不一样。 -!
生成一个HTML文档通常可以通过以下四种途径： h
1． 利用各种文本编辑器（如Windows记事本）直接使?TML语言编写； N
2． 借助一些HTML 的编辑工具，如FrontPage、HotDog等； 1=Af
3. 由其它格式的文 档（ 如WORD 文 档）转换成HTML 文档； VKnT
4. 由Web 服务器端实时动态地生成。 !
下面，我们针对第一种途径，围绕本书ASP文件中所使用的一些HTML文档，给大家做一简单介绍： "
A.2 标记语法和文档结构 6
HTML的标记总是封装在由小于号（<）和大于号（>） 构成的一对尖括号之中。 Kgw
A.2.1单标记 j(
某些标记称为“单标记”，因为它只需单独使用就能完整地表达意思，这类标记的语法 是： |vkH
< 标 记> ^4S
例如：后面要讲的换行标记<BR>就是一个单标记。 2F
A.2.2双标记 a>fKV
另一类标记称为“双标记”，它由“ 始标记”和“尾标记”两部分构成， 必须成对使 用，其中始标记告诉Web 浏览器从此处开始执行该标记所表示的功能，而尾标记告诉Web浏 览器在这里结束该功能。始标记前加一个斜杠（/）即成为尾标记。这类标记的语法是： 40X{
< 标记> 内容 </ 标记> 5p
其中“内容”部分就是要被这对标记施加作用的部分。例如你想突出对某段文字的显示，就将此段文字放在一对<EM></EM>标记中： i
<EM>text to emphasize</EM> `
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ "QapKC
A.2.3文档结构 c_o`
通常由三对标记构成一个HTML文档的骨架，它们是： O&p<,
<HTML> T
<HEAD> Y+
头部信息 b+za2
</HEAD> Bs|P9
<BODY> Ukc1w
文档主体，正文部分 ^y
</BODY> {f/Y+
</HTML> wO`r
其中<HTML>在最外层，表示这对标记间的内容是HTML文档。<HTML>标记也可以省略，因为.html或.htm文件被Web 浏览器默认为是HTML文档。<HEAD> 之间的内容包括文档的头部信息， 如文档总标题等，若不需头部信息则 可省略此标记。<BODY> 标记表示正文内容的开始。 X'8g
A.2.4文档基本属性的确定 s
在<BODY>标记中可以确定整个文档的背景色、前景色等基本属性。 )
语法： g|D0+%
<BODY [BGCOLOR|TEXT|LINK|ALINK|VLINK|BACKGROUND]> S:O
文档主体 p40
</BODY> fPJ
其中， jix.\I
BGCOLOR：HTML的背景色 gCQFHu
TEXT：指定HTML文件中文字色彩属性 {N
LINK：指定HTML文件中待连接超连接对象色彩属性 |Q4A{V
ALINK：指定HTML文件中连接中超连接对象色彩属性 }
VLINK：指定HTML文件中已连接超连接对象色彩属性 VYJv:T
BAKGROUND：指定HTML背景图形。 3hHY.R
例子： pg$^4"
<HTML> zyhF
<BODY BGCOLOR="FFFFFF" TEXT="#000000" LINK="0000FF" BZ4a
BACKGROUND="TEST.GIF"> 6:K
</BODY> Cs(
</HTML> a
上面实例表示文档背景色为白色，超连为蓝色，文字为黑色，并使用TEST.GIF图片做背景图。 bre
各属性的参数值可以是用英文描述的颜色如 “RED”、“BLUE”、“YELLOW”等，也可以是RGB值（见表A-1）,共6位，每种颜色两位从00到FF。如红色可以表示为“ff0000”，蓝色可以表示为“0000ff”等。 k*
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ e6R
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ ;Xd~
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ K<n
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ BL4<
A-1 各颜色与对应的RGB值 pwYI%
颜色 RGB值 颜色 RGB值 y>9k
黑色（BLACK） 000000H 黄色(YELLOW) FFFF00H >sUE
白色（WHITE） FFFFFFH 石灰色(LIME) 00FF00H L1{
绿色（GREEN） 008000H 水绿色(AQUA) 00FFFFH h)1Mm
褐红色(MAROON) 800000H 紫红色(FUCHSIA) FF00FFH x1{S
橄榄色(OLIVE) 808000H 银白色(SILVER) C0C0C0H }A%Fz
藏青色(NAVY) 000080H 红色(RED) FF0000H BhN2N
紫色(PURPLE) 800080H 蓝色(BLUE) 0000FFH '))t2
灰色(GRAY) 808080H au
A.3.1 注释标记 WfEFC
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ Gs
该标记用于书写文档源文件的注释，是一个单标记，注释内容在浏览器中不显示。格式为： FC
<!-- 注 释 内 容 --> kFLP%(
A.3.2 文件标题（<TITLE>|</TITLE>） %Qz9
<TITLE>和</TITLE>之间的部分，就是这一个HTML文档的总标题，它一般出现在<HEAD>标记中。文件标题一般会显示在Web浏览器最上面的标题（Title）栏的位置。用户可以把它加入BOOKMARK中。 TIbg
A.3.3 题头（<H>|</H>） C+CWe
题头标记有6种，分别为H1, H2,…H6，用于表示文章中的各种题目。标题号越小，字体越大。 2Oe2&
题头标记可以有对齐属性，align＝#，#可以为以下各值： 00uYH-
left 表示标题居左 f/C6
center 表示标题居中 >,
rigHt 表示标题居右 C
例如： <H2 align=center>CHapter 2 </H2> ?9r
A.3.4 段落标记（<P>） $]njO
HTML浏览器是基于窗口的，用户可以随时改变显示区的大小，所以HTML将多个空格以及回车等效为一个空格，这是和绝大多数字处理器不同的。HTML的分段完全依赖于分段元素<P>。例如： /lt
<H2>This Is a Level Two Heading</H2> s;9*
paragraph one <P> g-`-
paragraph Two <P> ze
<P>也可以有多种属性，比较常用的属性是： G+y
aligh＝#，#可以是left,center,right,其含义同上面的题头。 )"H~1t
A.3.5 换行标记（<BR>） Z
换行标记<BR>是一个单标记。这个标记用来标识一个换行动作。在HTML文件中可以用它来调整行间距。 O/2
A.3.6 横线标记（<HR>） .
横线标记一般用于分隔同一文体的不同部分，在窗口中画出一条水平横线，线的宽度和高度是可调的。这个标记对于美化页面是比较有用的。它的属性是ALIGN、WIDTH、SIZE分别用于调整线的位置和宽度。ALIGN的参数和题头、段落标记中的类似，也有RIGHT、CENTER、LEFT。WIDTH可以用百分数表示也可以用绝对值指明。 kl7
例如： "r
<HR width=50> 、<HR width=50%>。 k|u
A.3.7 有关字体标记（大小、风格、颜色、闪烁） U
1． 字体大小 @7#yia
HTML有七种字号，1号最小，7号最大。缺省字号为3，可以用<FONTSIZE=字号>来设置缺省字号。 O,\-
设置文本的字号有两种办法，一种是设置绝对字号，< FONT SIZE =字号>；另一种是设置文本的相对字号；< FONT SIZE =±n>。用第二种方法时“＋”号表示字体变大，“－”号表示字体变小。例如： T#tN,}
< FONT SIZE =7>Today is fine!</FONT> (%w
2. 字体风格 k
字体风格分为物理风格和逻辑风格。物理风格直接指定字体，物理风格的字体有<b>黑体，<i>斜体，<u>下划线，<tt>打字机体。逻辑风格指定文本的作用。如：<EM> </EM>突出显示（Emphasize），它并不指明怎样突 出法，而让Web 浏览器自行决定，大多浏览器就把它处理为斜体（等效于<I></I>）。类似的逻辑型标记还有： 0
<SRTONG></STRONG> 重点突出显示（Strong emphasize） cA{T
<ADDRESS> </ADDRESS> 按地址类型显示 /%rgi
<CODE> </CODE> 按代码类型显示， 等等。 9t=
例如：您可以使用下面语句通知浏览器以突出显示的方式显示字符串“Today is fine!” /4dsXC
<EM> Today is fine! </EM> F/Vnbk
3. 字体颜色 Lkcb(
字体的颜色用<FONT color=#>指定。其中，#参数值可以是用英文描述的颜色如 “RED”、“BLUE”、“YELLOW”等，也可以是RGB值（参见前面表A-1）。 Sp
4. 字体闪烁 ^I9g
<BLINK>文本</ BLINK >使文本闪烁，闪烁频率为１秒钟一次。 ])Lx
A.3.8 预编排文本（<PRE>） icN
HTML的输出是基于窗口的，因而HTML文件在输出时都是要重新排版的，若确实不需要重新排版的内容，可以用<PRE>…<／PRE>通知浏览器。浏览器在输出时，对这部分内容几乎不做修改地输出，输出的字体电传打字机字体。例如： 3}=
<PRE> I
please use your card. OXoA
VISA Master v$u"\7
<B>Here is an order form.</B> !tJ0P5
<ul><li>Fax ~
<li>Air Mail </ul> d
</PRE> zP5zE
A.3.9 居中（<CENTER>…<／CENTER>） 2tZXQX
很多标记都有对齐方式属性，如<H>、<P>等。也可以直接用居中链接签<CENTER>…<／CENTER>。例如： &t
<CENTER> 6_g60
This must be my dream. lg
<／CENTER> le6'O
A.3.10 清单标记（List） oI)
清单用于列举事实，常用的清单有3种格式，即无序清单(unordered List)，有序清单(ordered list)和定义清单(definition list)。 '}_1x
1.无序清单(UL) t;y4E
无序清单用(UL)开始，每一个清单条目用<LI>引导，最后是</UL>，注意清单条目不需要结尾链接签</LI>。输出时每一清单条目缩进，并且以黑点标示。例如： iu
<UL> 3
<LI>Today }:JyW)
<LI>Tommorow ceWZE?
</UL> O=gy
输出为 qP0u5
●Today ~[:[?g
●Tommorow r;No
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ sN{
2．有序清单<OL> ^$J
有序清单与无序清单相比，只是在输出时清单条目用数字标示，下面是一个例子及其输出。例如： }wc
<OL> $ytppr
<LI>Today [o
<LI>Tommorow cmlN-\
</OL> jP6E5
输出为： G
1.Today y
2.Tommorow VbPf
3. 定义清单<DL> ~FTfV
定义清单用于对清单条目进行简短说明的场合，用<DL>开始，清单条目用<DT>引导，它的说明用<DD>引导。例如： /Q|<5,
<DL> 8f
<DT>Item 1 .[BG
<DD>The definition of item 1 7L+!c
<DT>Item 2 A><
<DD>Definition or explaination of item 2 !kj+
</DL> H
输出为： Q
Item 1 \TqC
The definition of item 1 {.fE
Item 2 bym<Xe
Definiton or explaination of item 2 X+4
A.3.11 URL和超链 ?1b<
创建一个超链（Hyperlink）是HTML语言中的一个重要部分。一个超 链又称作锚（Anchor），它唯一地指向另一个Web信息页，超链如同把Gopher 中可触发的菜单项融于正文之中，因此超链更具有上下文的含义。 p
1.URL 格 式 y+o]
一个Web信息页是用URL（Universal Resource Location，统一资源定位器）来唯一标识的，URL的一般格式为： %"*
访问方式：//服务器域名/路径及文件名 B7Aa@
其中访问方式可有HTTP、FTP、TELNET、GOPHER、WAIS、NEWS、MAILTO、FILE等等。随着访问方式的不同，冒号后面的参数格式也会不同，下面是一些URL的例子： $
http://www.ecnu.edu.cn/coliege/science/computer/computer.htm B!n<$N
ftp://ftp.sjtu.edu.cn/pub/ q
mailto:webmaster@www.ecnu.edu.cn 590h<
<I>file:</I>///c|/html/sample.htm _;H
2．跳转至另一篇文章 Ixl
HTML文章的另一个特色，就是在文章段落间任意地跳转。可以跳到另外一台机器上的文件，也可以跳到文章的另一个段落或本机的另一片文章。下面是它标注的格式。基本上，它会是这一个样子： rgY>
<A href="URL" >Link to filename </A> BV
在浏览器中，我们将可以看到“Link to filename”会变色并加下底线，当鼠标移到上面时，会从箭头转成手指，这表示你可以在这儿用鼠标按一下：会跳转到URL地址框中所指定的文档中。 !7Lj#1
例如：想连结中央电视台，可以写成下面那样： 8
<A HREF="http://www.cctv.com.cn/ ">中央电视台</A> I
3. 跳转至另一个段落 i
除了跳到另一个HTML文件，也可以在一篇文章内随心所欲地跳转。首先看看它在“”引号中的表示方式 LH!`
<A HREF="#clients">Jump to Clients </A> z?SgR
同样，在浏览器中当鼠标移到“Jump to Clients”上面时，会变成手形，当我们单击鼠标时就会连接到文档中有标注<A NAME= "clients"> Clinets </A>的地方。 L.<sL
如果这两个标注是在不同的文件内，则表示方法有点儿改变。若Jump to Clients 在A文章，而Clients 在B文章中，则要改成 pb
<A HREF="filenameB#clients"> Jump to Clients </A> m
这样一来，当我们在A文章中点Jump to Clients 时就会跳到B文章的Clients这个字的位置，而不是B文章中的其它地方。 ]
A.4 图像、声音、视频和动画 v$O
HTML文档的另一个重要特性就是能把多媒体信息综合在一起，使显示 的信息更加多姿多彩。 [2 {~
A.4.1 图像 _Mr j
HTML支持内嵌式的图像显示。HTML 的图像标记是一个单标记，它的格式为： 55E_
<IMG SRC="URL 信 息"> =1'
其中属性SRC 表示图的源（Source）文件，因此这里的URL信息必须 对应一个图像文件。目前有以下几种图像的格式能被Web浏览器直接解释：GIF 格式（.GIF 文 件， 支 持256 色）；位图文件；JPEG 格式（.JPG、.JPEG 文件 ，支持RGB色）。 .-'96"
对于段落中的图像，还可以利用ALIGN 属性定义图与文本行的对齐方 式，其属性值可取TOP（ 与文本行顶部对齐）、MIDDLE（ 中间对齐）、 BOTTOM（ 底部对齐， 默认值）、LEFT（ 将此图显示在窗口左方）、RIGHT（ 将此图显示在窗口右方）。 例 如： +O'
<H2><IMG ALIGN=MIDDLE SRC="boat.gif"> This middle-align.</H2> T
如果您不满意图像的原始尺寸，可以用属性WIDTH 和HEIGHT分别重新定义图像的宽度和高度，属性值为用整数表示的屏幕像素点的个数。 cLr'x}
如果您想让图像单独占一块区域，不要忘了在图像标记的前后加上<P> 或<BR> 标记。例如： )]?)6
<P><IMG SRC="revbar.gif"><P>stand alone with the text.<P> y
图像同样也可以作为一个超链，例如： *6P$
<A HREF="detail.htm"><IMG SRC="model.gif">Click the image </A> 4
Web浏览器在超链图像的四周画一个边框，以示可被触发。若想去掉这个框只需在<IMG>中加上属性BORDER=0 就可以了。 %C]Y
A.4.2 声音和视频 $P
Web 浏览器自身不能解释声音和视频文件，但它能通过其它辅助工具的帮助来播放声音和视像文件。一般声音文件带有.WAV、.AU、.SND等文 件扩展名，而视频文件带有.AVI、.MPG等文件扩展名。要播放这些文件， 就必须把这些文件作为一个超链中的URL信息。当用户触发这一超链时，Web浏览器发现自己无法解释这类文件，就在辅助工具表中启动相应的程序来播放它们。例如： NA
<H2>Here is the <A HREF="demo.avi">video demo</A>.</H2> R"~n
当用户触发video demo的超链后，Web浏览器立即启动mplayer程序 来播放demo.avi视像文件。 aTC
A.4.3 动画 h
SUN公司开发了一套称为Java的通用程序设计语言，利用它制作的Homepage可支持内嵌式的动画和内嵌式的声音。 您可以用SUN公司的Web 浏览器HotJava 来观看带有Java标记的 Homepage。 U]ha,
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ /9
A.5 表格（Table） QA#~
Table是一种用来描述表格信息的新结构，它是HTML3.0中的一个重要内容。 U\X/
A.5.1 一 个Table 实 例 '
Table往往是由一个表格名称再加上一行或多行的表格内容所构成块状结构。表格的每一行内又由一个或多个表项单元组成，并且表项单元还可以按照行或列的方式结合在一起，成为一个大的表项单元。下面我们先 来看一个Table实例： 7WcH]E
<TABLE BORDER=2 WIDTH=300 bgcolor=#ffffffff> ,_ha@
<CAPTION>一个表格实例</CAPTION> v1
<TR> ZNjx
<TH>学号 [K
<TH>姓名 q@8
<TH>性别 tqz
<TH>年龄 Zx
</TR> ^
<TR> N_D#[
<TD>01 v%|
<TD>郭海平 4
<TD>男 IH<Sw
<TD>19 sW
</TR> {
<TR> ar
<TD>02 iP=R
<TD>王燕 &Lr*\
<TD>女 Qi|>=;
<TD>18 H
</TR> fK&8
</TABLE> $<G/
下图是这一实例的显示效果： V
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ qo%
A.5.2 Table 元素 :
下面我们就根据上面的实例来分析一下Table中的各个元素： 8j|
1．<TABLE> 表 格 内 容 </TABLE> AK%3i
一对<TABLE>标记是一个Table结构的最外层，它主要包括三个重要属 性。一个是用来表示表格边框粗细程度的属性BORDER，属性值取整数，如果省略BORDER属性，则表示不加边框。另一个是用来表示表格宽度的属性WIDTH，其属性可取相对值(表示相对于充满窗口的百分比，WIDTH=30%），也可取绝对值（用整数表示的屏幕像素点的个数），缺省值是"100%"。还有一个属性是CELLPADDING，用来表示每个表项单元的内容与表格边框之间所空开的距离，用屏幕像素点为单位，缺省值是0。 =]$W
2．<CAPTION> 表 格 名 称 </CAPTION> \cJV.$
在一对<CAPTION>标记中是这张表格的名称信息，它通常被Web浏览器 显示在表格上方的中央部位。 &au}!
3．表格颜色 b%
表格的颜色用bgcolor=#指定。其中，#参数值可以是用英文描述的颜色如 “RED”、“BLUE”、“YELLOW”等，也可以是RGB值（参见前面表A-1）。例如： /
<table border> T"
<tr> p_[]
<th bgcolor=000000><font color=ffffff>Food</font></th> T
<th bgcolor=whit>Drink</th> #-_
<tr><td bgclor=ffaaaa>A</td><td>B</td> Z
</table> r[m3e-
4．<TR>表 格 当 前 行 的 内 容 ioE0
单标记<TR>表示一个新的表格行（Table Row）的开始。 h:]~G
5．<TH>表项标题内容，<TD>表项数据内容 D7h8f
单标记<TH>和<TD>都表示在表格的当前行里产生一个新的表项单元。其中<TH>表示一个表项标题（Table Header）单元，而<TD>表示一个表项 数据（Table Data）单元。Web浏览器一般把<TH>中的文本用粗体表示。 每个表项单元（<TH> 或<TD>）都可带有表示横向对齐方式的属性ALIGN，属性的取值范围主要有LEFT，CENTER，RIGHT等，其中<TH>的缺省值是LIGN=CENTER，<TD>的缺省值是ALIGN=LEFT。另外还有表示纵向对齐方式的属性 VALIGN，属性的取值范围主要有TOP，MIDDLE，BOTTOM 等，其中<TH> 和<TD>的缺省值都是VALIGN=MIDDLE。 nKkr'y
A.5.3 表的通栏 I!
1.有横向通栏的表用<th colspan=#>属性说明。colspan表示横向栏距，#代表通栏占据的网格数，它是一个小于表的横向网格数的整数。 5|9
2.有纵向通栏的表用rowspan=#属性说明。rowspan表示纵向栏距，#表示通栏占据的网格数，应小于纵向网络数。 1
需要说明的是有纵向通栏的表，每一行必须用</tr>明确给出一横向栏目结束,这是和表的基本形式不同的。下面这个实例就是一个有通栏的表格： ztBA
<TABLE BORDER=3 WIDTH=300"> %|=rf
<CAPTION>一个有通栏的表格</CAPTION> b8sI
<TR><TH ROWSPAN=2><TH COLSPAN=2>平均值 de
<TH>其他<TH>杂项 _9rKe\
<TR><TH>重量<TH>重量 xa
<TR><TH ALIGN=LEFT>雄性<TD>1.9<TD>0.003 .;Y
<TR><TH ALIGN=LEFT ROWSPAN=2>雌性<TD>1.7<TD>0.002 KC
</TABLE> g6
下图是这个实例在IE4.0浏览器中的显示效果： s!4
A.6 表单 {TyT5
通过表单可以增强网页的加交互能力。网页（Homepage）并非只是给人观看的信息页，有时还需要获取用户的反馈信息，并且Web服务器根据得到的反馈信息还要给用户作出相应的回答。HTML中的form结构就是专为提供这种交互界面而设计的。form结构也是一张表。它与Table表的区 别在于：Table表是给用户看的，而form表是让用户填的。因此form表又有其特殊的组成元素。 AjC}
A.6.1 一个表单实例 ?jy2Yo
下面HTML文档是一个表单： AV#;w
<HTML> joN[9
<HEAD><TITLE>form集合的用法</TITLE></HEAD> 6*cVH8
<BODY BGCOLOR="#FFFFFF"> qH
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ >_d
<H4>***信息港免费用户注册登记页</H4> *L{4aX
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ hP&3G&
<form method="POST" action="2-1.asp" > o]`VWP
姓名：<input name="username" type="text" size=16><br> 0
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ N'Lt
性别：<input name="gender" type="radio" value="男" checked>男 -)
<input name="gender" type="radio" value="女">女<br> ,4[2o
学历： LCX\~H
<select name="knowledge" > .
<option>初中 =
<option>高中 {}x(X[
<option>专科 RKr=8%
<option selected>大本 +a
<option>研究生 !vpd
<option>博士生 +q>oP
</select><br> b*T
E-mail：<input name="e-mail" type="text" size=16><br> 2^*
爱好：<input name="hobby" type="checkbox" value="文学">文学 Z3uhNb
<input name="hobby" type="checkbox" value="体育">体育 "
<input name="hobby" type="checkbox" value="音乐">音乐 z@64y
<input name="hobby" type="checkbox" value="??quot;>??lt;br> (BTc:
<br><br> l"
<input type=submit value="提交"> r~m<
<input type=reset value="取消"> m
</form> 6
</BODY> L: .
</HTML> A
其在IF4.0浏览器中的运行结果如下?荆?E1!=j<
段沂峭堋仿厶 -- 菜鸟？大虾？这里就是你的地盘！ !8
A.6.2 表单（form） 元素 >j,H
下面我们就来结合上面的实例简要介绍一下form 表单中的常用元素： )_=
1. <form ACTION= "URL 信息" METHOD= 数据传送方法> GK{
form表内容 XwC
</form> mC2
一对<form>标记是一个form 表单的最外层。form表单不允许嵌套，也就是说一个form中不可以再包含其它form。其中ACTION属性表示用户提交表格时所要启动的相应处理程序。在HTTP中必须是一个EXE可执行文 件。METHOD属性表示怎样将数据传送给Web服务器，一种是GET方法（也 是缺省方法），它将数据附加在URL信息上传送给Web服务器；另一种是POST方法，它将数据独立成块地传送给Web服务器。如果传送数据量大的 话，还是建议用POST方法，因为多数Web服务器的GET方法是通过命令行参数来传递数据，而命令行参数的长度是有限的。 D~`>
2.<INPUT TYPE= 输 入 方 式> Oy="2
单标记<INPUT>代表输入元素，根据TYPE值的不同，又各自有一套特殊的属性。具体如下： L}y6$;
（1）<INPUT TYPE=TEXT NAME="变量名"> y,n09
表示单行文本输入框，NAME属性表示此文本框的变量名，它将与用户填入文本行中的数据一起交给Web服务器。其它可选属性还有SIZE（输入 框显示的长度），MAXLENGTH（输入的最多字符数），value（文本框内的初始值）。 PM
（2）<INPUT TYPE=RADIO NAME="变量名" value="值名"> JE|24
表示一个单选按钮，NAME属性表示这一组按钮的变量名，value属性 是此组按钮中这一按钮值的名称。可选属性还有CHECKED（表示被初始选中）。 ?c
（3）<INPUT TYPE=CHECKBOX NAME="变量名" value="值名"> VT+tG
表示一个复选框，可选属性还有CHECKED。 fq
（4）<INPUT TYPE=SUBMIT>和<INPUT TYPE=RESET> 3J;\
分别表示发送按钮和取消按钮。当用户填完表格后，按了SUBMIT 按钮就表示要发送数据，按RESET按钮就表示要取消并清除所填内容，回到初始状态。可选属性还有value（表示按钮的标题内容）。 #0t
3.<SELECT NAME= 变 量 名> 2
各 选 项 yK
</SELECT> 3E+xGZ
一对<SELECT>标记表示一个选择框。可选属性还有SIZE（如果SIZE=1或省略此属性，则Web浏览器将它显示为一个组合框；如SIZE值大于1，则显示为一个列表框，并且列表框中一次显示的项数为SIZE 的属 性值），MULTIPLE（表示可以复选）。 !^
4.<OPTION> 选 项 内 容 2L\[S[
单标记<OPTION>必须在一对<SELECT>标记中使用，表示具体的选项。可选属性还有SELECTED（初始选中），value（选项值名，缺省值为"选项内容"）。 XGKh7J
5.<TEXTAREA NAME=" 变量名"> DU}uy>
初 始 值 ^~9X
</TEXTAREA> Q
一对<TEXTAREA>标记表示一个多行文本输入框，其中"初始值"为显示在文本框中的初始内容。可选属性还有ROWS（显示几行），COLS（信息几列）。 _+
顶
后一篇 >IT人必读:写给浮躁的IT同仁