Meta用法
<meta name=”generator” content=”microsoft frontpage 3.0″>说明编辑工具；
<meta name=”keywords” content=”…”>说明关键词；
<meta name=”description” content=”…”>说明主页描述；
<meta http-equiv=”content-type” content=”text/html; charset=gb2312″>设定中文自动跳行
<meta http-equiv=”Content-Type” content=”text/html; charset=big5″>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
设定这是 HTML 文件及其编码语系，中文网页请使用 big5 那行，或者不设编码亦 可，纯英文网页建议使用 iso-8859-1。
<meta http-equiv=”content-language” content=”zh-cn”>说明所用语言及文字
<meta http-equiv=”refresh” content=”10; url=http://yourlink”>自动刷新，并指向新网页
网页间转换时加入效果
<meta http-equiv=”page-enter” content=”revealtrans
(duration=10, transition=50)”>
<meta http-equiv=”page-exit” content=”revealtrans
(duration=20, transition=6)”>
加在一个网页中，进出时有一些特殊效果，这个功能即frontpage 98的format/page transition.不过注意所加网页不能是一个frame页;
强制网页不被存入cache中
<meta http-equiv=”pragma” content=”no-cache”>
<meta http-equiv=”expires” content=”wed, 26 feb 1997 08:21:57 gmt”>
<meta http-equiv=”window-target” content=”_top”>
可以防止网页被别人作为一个frame调用.
<link href=”css.css” rel=”stylesheet” type=”text/css”>
连接css样式表
<link href=”URL” rel=”relationship”>
<link href=”URL” rev=”relationship”>
2. <body bgcolor=# text=# link=# alink=# vlink=#>
bgcolor — 背景色彩
text — 非可链接文字的色彩
link — 可链接文字的色彩
alink — 正被点击的可链接文字的色彩
vlink — 已经点击(访问)过的可链接文字的色彩
背景图象 <body background=”image-URL”>
Non Scrolling Background <body bgproperties=FIXED>
页面左边的空白 <body leftmargin=#>
页面上方的空白(天头) <body topmargin=#> #=margin amount
<body leftMargin=0 topMargin=0 marginwidth=”0″ marginheight=”0″ style=”border-collapse: collapse”>
marginwidth和marginheight分别用来指定浮动窗口内的页面与浮动窗口之间在水平方向和竖直方向上的填充距
3. <a href=”URL”> … </a>
跳转到页面的另外一个地方
<a href=”#name”> … </a> <a name=”name”> … </a>
跳转到另一个页面的某个地方
<a href=”URL#name”>…</a> <a name=”name”>…</a>
<a id＝value href＝reference name＝value rel=same|next|parent|previous rev＝value target＝window style＝value title=title onclick＝function onmouseout＝function onMouseOver=function> </a>
rel：表示设定链接的关系：rel=same表示待链接的文件与此文件相同，rel=next表示待链接的文件为下一页，rel＝parent表示本文件为待链接文件的父文件，rel=previous则表示待链接的文件为上一页。
rev：则用于设定反向链接。
target：是在采用帧窗口的情况下设定链接到哪一个窗口，还有target=”_bank”是表示新开一窗口打开网页。
title：用于设定链接点被选到时显示的标题。
onclick：对应于一个事件，当链接点被点击后将触发这个事件，执行对应的子程序。
onmouseover：与onclick类似，对应的事件在鼠标移到链接点上时被触发。
onmouseout：对应的事件在鼠标移出镇接点后被触发
a href=”mailto:someone@somewhere.com?subject=Flash问题>Flash答疑信箱</a>
<link REL=”SHORTCUT ICON” href=”
[url]http://www.somewhere.com/icon.ico[/url]”>
<base> 是一个连结基准标记，用以改变文件中所有连结标记的参数内定值。它只能应用 於文件的开头部分，即标记 <head> 与 </head> 之间。
<base> 的一般参数设定：
<base href=”http://www.microsoft.com/” target=”_top”>
href=”http://www.microsoft.com/”
设定该页网页中所有 HTTP 文件及图形（包括相对路径连结及 <img> 图形标记 等）的内定路径，其他如 ftp:// 及 gopher:// 等则不受影响。这参数只可填入一个相 对或绝对的路径，不必填入档案名称。一般相对路径连结及 <img> 图形标记等是 内定以该页网页所在的目录作为起点，若依这例子，该文件中所有连结将会以 [url]http://www.microsoft.com/[/url] 作为起点，若其中有连结如 <a href=”index.html”>Back to Main Page</a> ，那末它不会连到自已目录下的 index.html，它将会连到 Microsoft 的 首页，这是因为相对路径己给 <base> 转成绝对的了。
target=”_top”
设定该页网页中所有连结被按後之结果所要显示的视窗，免得分别为所有连结加 上 target 参数，常应用於框架中。其设定与 <a> 连结标记中 target 参数相同。
BASE主要有两种用处：
1、<base HREF=”原始地址”>
本文档的原始地址。这样，读者下载你的文档之后，也可以知道是从哪里下载的。
2、<base TARGET=”目的框架名”>
在一个框架（frame）页中，如果要把某个框架的连接在另外一个框架显示，例如，把menu框架中的连接显示到content框架，就可以在menu框架中的页面加上<base TARGET=”content”>，这样，就没有必要在menu页面的所有连接的<a>标记中添加target属性了，除非这个连接不是在content框架中显示
4.标尺线 <hr />
宽度 <hr size=#> 长度 <hr width=#>
位置 <hr align=#> #=left,right
<hr noshade>设定线条为平面显示，若删去则具阴影或立体，这是内定值
<hr color=#> #=rrggbb 16 进制 RGB 数码，或者是下列预定义色彩：Black,Olive,Teal,Red,Blue,Maroon,Navy, Gray,Lime,Fuchsia,Green,Purple,Silver,Yellow,Aqua
5. 标题 <hn>—</hn> 这些标记显示黑体字。这些标记自动插入一个空行，不必用 <p> 标记再加空行。因此在一行中无法使用不同大小的字体。
6. <font size=#> … </font>
<font color=#><font face=#>
<basefont> 可以用于文件的开头部分，即<head>与</head>之间的位置，将影响全文字句，是一个空标记，用以改变字体显示的内定值。
<pre></pre>预设置格式标记 令文件按照原始码的排列方式显示
物理字体：加粗<b>倾斜<i>下划线<u>变大<tt>上标<sup>下标<sub>中间划线<s><strike>
逻辑字体：斜体<em>加粗<strong>变大<code>变大<samp>变大<kbd>斜体<var>斜体<dfn>斜体<cite>变小<small>变大<big>
物理标记有固定的显示效果，逻辑标记则依不同浏览器而不同。
多个实体标记亦可有效标示同一字句，逻辑标记则通常于旧浏览器不能有效显示多 重的标示。
一、<i> <em> <var> <cite> <dfn> <address>：这些标记于 Internet Explorer 都产生斜体效果，而只有 </dfn> 于 Netscape Netvigator 失去作 用。这些标记中只有 <address> 较为特别，因它包括换行效果所以不必在它前面加上 <br /> 标记。
二、<tt> <samp> <code> <kbd> <u> <strike> <big> <small> <sup> <sub>
<tt> <samp> <code> <kbd> 可令每字母有相等宽度且每字母之间的距离稍为加 宽。但于 NC 不见得如此。
<u> 是加底线的标记，一些特别的浏览器并不支援，因顾虑到与连结混淆。
<strike> 加上删除线的标记。
<big> 令字体加大。<small> 令字体变细。
<sub>为下标字<sup> 则为上标字，仅剩的数学标记
7.&#; #=字符实体名称或者 ascii值
& & < < > > " ” ® ® 己注册
© © 版权 ™ ™ 商标  半方大的空白
  全方大的空白 不断行的空白
8.布局控制
行<p>换行<br />不换行<nobr>；<wbr>称为建议折行标记。作用：预设折行部位；中间<center></center>
位置<div align=#></div> #=left;right;center
属性：Class ; Style ; title ; ID
9.列表
无序列表 <ul><li>…</ul>
有序列表 <ol><li>…</ol>
定义列表(Definition lists) <dl><dt>…<dd>…</dl>
<dt>用以标示定义条目，<dd>则用以标示定义内容。所谓定义清单就是一种分二层的项目清单，其不故符号及数目。
<li type=#> #=disk, circle, square
<li type=#> #=A, a, I, i, 1
表中的序号的起始值 <ol start=#> #=number
多媒体技术
<bgsound src=”your.mid” autostart=true loop=infinite>
src=”your.mid”
设定 midi 档案及路径，可以是相对或绝对。
autostart=true
是否在音乐档传完之後，就自动播放音乐。true 是，false 否 (内定值)。
loop=infinite
是否自动反覆播放。LOOP=2 表示重复两次，Infinite 表示重复多次
<embed> 是用以插入各种多媒体，格式可以是 Midi、Wav、AIFF、AU 等等，Netscape 及 新版的 IE 都支援。其参数设定狻多。如下
<embed src=”your.mid” autostart=”true” loop=”true” hidden=”true”>
src=”your.mid”
设定 midi 档案及路径，可以是相对或绝对。
autostart=true
是否在音乐档传完之後，就自动播放音乐。true 是，false 否 (内定值)。
loop=”true”
是否自动反覆播放。LOOP=2 表示重复两次，true 是， false 否。
HIDDEN=”true”
是否完全隐藏控制画面，true 为是，no 为否 (内定)。
STARTTIME=”分:秒”
设定歌曲开始播放的时间。如 STARTTIME=”00:30″ 表示从第30秒处开始播放。
VOLUME=”0-100″
设定量的大小，数值是0到100之间。内定则为使用者系统本身之设定。
WIDTH=”整数” 和 HIGH=”整数”
设定控制画面的宽度和高度。(若 HIDDEN=”no”)
ALIGN=”center”
设定控制画面和旁边文字的对 方式，其值可以是 top、bottom、center、baseline、 left、right、texttop、middle、absmiddle、absbottom。
CONTROLS=”smallconsole”
设定控制画面的外貌。预设值是 console。
console 一般正常的面板
smallconsole 较小的面板
playbutton 只显示播放按钮
pausecutton 只显示暂停按钮
stopbutton 只显示停止按钮
volumelever 只显示音量调整钮
表单的基本语法
<form action=”url” method=# target=”windows”>
<input type=submit value=”发送”>
<input type=reset value=”重设”>
#=GET, POST
<form onsubmit=function>
POST容许传送大量资料，但GET则只接受低于1K
表单中提供给用户的输入形式
<input type=* name=**>
*=text, password, checkbox, radio, image, hidden, submit, reset
type－file：表示插入一个文件type＝image：表示插入一个图像；onclick：表示在按下输入时调用指定的子程序；onselect：表示当前项被选择时调用指定的子程序。
**=Symbolic Name for CGI script
文字输入和密码输入
*=text, password
<input type=*>
<input type=* value=**>
<input type=* name=**>
<input type=* size=**>
<input type=* maxlength=**>
type=”Text”输入方式为 Text，能产生一单行文字盒，上限为 255 字元。
name=”age”此一单行文字盒名称，这是最重要的一个，方便 CGI 辨认由表单传来的资料，虽 说可随便命名，但通常 CGI 程式中都有指定名称，若转用其它名称便需要修改该 CGI 程式了，名称可为没空白没特别符号的英文或数字，有大小写的分别，可以 写成 Your_Age，若有访客于此表单此一文字盒填入 40 的话，那末传给 CGI 的字 串便是 Your_Age=40。
value=”20″此一单行文字盒内定值。若不填写则文字盒是空白的，等待访客亲自键入，若 value=”20″ 的话， 20 便会出现在文字盒中，当然访客可以修改之。
align=”MIDDLE”可选值：top, middle, bottom, left, right, texttop, baseline, absmiddle. 没太大有处。
size=”2″此一单行文字盒显示的长度，若馈下是采用 Big5 编码的中文网页便要小心，同 size 的文字盒 NC 会显示得比 IE 狻长。
maxlength=”255″此一单行文字盒可输入字元的上限，为方便编排资料或避免错输入等，宜设定上 限，例如输入电话或 ICQ UIN 的可设为 8，年龄为 2 等。
<input disabled>
disabled属性可以将一种操作屏蔽起来，例如禁止用户选择，点击按钮或者使用TAB键在不同的TEXT间切换。
readonly属性顾名思义是“只读”。它将TEXT转化为一个对象，禁止对它进行编辑。
复选框(Checkbox) 和 单选框(RadioButton)
<input type=checkbox>
<input type=checkbox checked>
<input type=checkbox value=**>
<input type=radio value=**>
<input type=radio value=** checked>
请选性别：
<input type=”Radio” name=”gender” value=”Female”>女
<input type=”Radio” name=”gender” value=”Male” checked>男性
value=”Leon”
内定值。每一个Checkbox 必须及仅有一个value，当被剔选时这值便会传及CGI，例如所传字串idol=Leon
checked
设该 Radio 为内定被选。同 name 的各个 Radio 中只能有一个使用，或全不使用这 参数
图象坐标
<input type=image src=url>
<form action=/cgi-bin/post-query method=POST>
<input type=image name=face src=f.gif>
<input type=radio name=zoom value=2 checked>x2
<input type=radio name=zoom value=4>x4
<input type=radio name=zoom value=6>x6<p>
<input type=reset>
</form>
<input type=”Image” name=”submit” align=”BOTTOM” src=”ex_icon.gif”>
<input type=”File” name=”upload” align=”BOTTOM” size=”20″ maxlength=”100″ accept=”text/html”>
input type=”File”
输入方式为 Image。通常用以传输文件。
<input type=”Button” name=”useless” value=”Back”>
type=”Button”
输入方式为一般按键。常配合 Java Script 作为其启动按键。
name=”useless” 这文件传输的名称，用处不大。
value=”Back” 按键显示名称。
<input type=”Button” value=”回前一页” onclick=”history.go( -1 );return true;”>
隐藏表单的元素
<input type=hidden value=*>
<form action=/cgi-bin/post-query method=POST>
<input type=hidden name=add value=hoge@hoge.jp>
Here is a hidden element. <p>
<input type=”Hidden” name=”ID” value=”6618″>
列表框(Selectable Menu)
<select>是卷动选单标记，每一选项皆由 <option> 所标示，把它当作围堵标记或空标 记使用都可以。
<select> 的参数设定（常用）：
<select name=”where” size=”6″ multiple>
name=”where” 这卷动选单的名称，作识别之用，将会传及 CGI。
size=”6″ 这卷动选单的列数，即其高度，请自行修改。若使用此参数则不会有 Pop Up 效 果。
multiple 令这卷动选单容许多重选择。
<option> 的参数设定（常用）：
<option value=”tw” selected>
value=”tw” 这选项的值，将会传及 CGI。请自行修改，但不同选项必须有不同的值。
selected 设该选项为内定被选。一个单选卷动选单只能有一项或零可内定被选。
<select name=*>
<option> …
</select>
<option selected>
<option value=**>
<select size=**> 表单宽度
<select size=** multiple>
注意，是用 Ctrl 键配合鼠标实现多选。
文本区域
<textarea>是表单文字区块标记，常用于 bug report, feedback 等需要填写大量资料的用 途。
<textarea> 的参数设定（常用）：
textarea name=”comments” cols=”40″ rows=”4″ wrap=”VIRTUAL”>
name=”comments”
这文字区块的名称，作识别之用，将会传及 CGI。
cols=”40″
这文字区块的宽度，请自行修改。
rows=”4″
这文字区块的列数，即其高度，请自行修改。
wrap=”VIRTUAL”
设定其折行问题，可选值为： off, physical, virtual。off 表示不使用此属性，physical 时则会强迫刘览器在送资料到 CGI（Web 伺服器端）必须将实№文字中的换行一 并送出，设为 virtual 时则送出连续成串的字（除非使用者按了键盘的 RETURN / ENTER）。
表格的色彩
表元的背景色彩和背景图象
<td bgcolor=#>
<td background=”URL”>
<tr><td></td></tr>
<td colspan=*>合并多少列
<td rowspan=*>合并多少行
表格边框的色彩
<table bordercolor=#>
<table cellspacing=5 border=5 bodercolor=#ffaa00>
表格边框色彩的亮度控制
<table bordercolorlight=#>表格边框向光部分的颜色
<table bordercolordark=#>表格边框背光部分的颜色
表格的分组显示(Structured Table)
按行分组
<thead> … </thead> – 表的题头(Header)
<tbody> … </tbody> – 表的正文(Body)
<tfoot> … </tfoot> – 表的脚注(Footer)
按列分组
<colgroup align=#> #=left, right, center
列的属性控制
<col span=#> #=从左数起，具有指定属性的列的列数
<col align=#> #=left, right, center
表格中边框的显示
显示所有4个边框<table frame=box>
只显示上边框 <table frame=above>
只显示下边框 <table frame=below>
只显示上、下边框 <table frame=hsides>
只显示左、右边框 <table frame=vsides>
只显示左边框 <table frame=lhs>
只显示右边框 <table frame=rhs>
不显示任何边框 <table frame=void>
表格中分隔线(Rules)的显示
显示所有分隔线 <table rules=all>
只显示组与组之间的分隔线<table rules=groups>
只显示行与行之间的分隔线 <table rules=rows>
只显示列与列之间的分隔线 <table rules=cols>
不显示任何分隔线 <table rules=none>
表格的基本语法
<table>…</table>定义表格
<tr> – 定义表行<th> – 定义表头<td> – 定义表元
带边框的表格：<table border>
不带边框的表格：<table border=”0”>
跨多行、多列的表元(Table Span)
跨多列的表元 <th colspan=#>
跨多行的表元 <th rowspan=#>
表格尺寸设置 <table border=#>
边框尺寸设置：<table border width=# height=#>
表格格线厚度：<table border cellspacing=10>
文字与格线的距离：<table border cellpadding=10>
cols=”2″表格栏位数目，只是让浏览器在下载表格是先画出整个表格而己。
表格内文字的对齐/布局
<tr align=#> 水平
<th align=#> #=left, center, right
<tr valign=#> 垂直
<th valign=#> #=top, middle, bottom, baseline
表格在页面中的对齐/布局(Floating Table)
<table align=left>
<table align=right>
<table vspace=# hspace=#> #=space value
表格的标题
<caption align=#> … </caption> #=left, center, right
<caption valign=#> … </caption> #=top, bottom
Valign=”top” is default
<caption> 的作用是为表格标示一个标题列，有如在表格上方加上一没格线的打通列。 当然亦可置于下方，通常用以存放该表格的标题。
框架基本语法
<frameset> 称框架标记，用以宣告HTML文件为框架模式，并设定视窗如何分割。
<frame> 则只是设定某一个框窗内的参数属性。
<frameset> 参数设定：
<frameset rows=”90,*” frameborder=”0″ border=0 framespacing=”2″ bordercolor=”#008000″>
COLS=”90,*”
垂直切割画面(如分左右两个画面)，接受整数值、百分数， * 则代表占用馀下空 间。数值的个数代表分成的视窗数目且以逗号分隔。例如 COLS=”30,*,50%” 可以 切成三个视窗，第一个视窗是 30 pixels 的宽度，为一绝对分割，第二个视窗是当 分配完第一及第三个视窗後剩下的空间，第三个视窗则占整个画面的 50% 宽度 为 一相对分割。您可自己调整数字。
ROWS=”120,*”
就是横向切割，将画面上下分开，数值设定同上。唯 COLS 与 ROWS 两参数尽量 不要同在一个 <frameset> 标记中，因 Netacape 偶然不能显示这类形的框架，尽 采用多重分割。
frameborder=”0″
设定框架的边框，其值只有 0 和 1 ， 0 表示不要边框， 1 表示要显示边框。（避 免使用 yes 或 no ）
border=”0″
设定框架的边框厚度，以 pixels 为单位。
bordercolor=”#008000″
设定框架的边框颜色。
framespacing=”5″
表示框架与框架间的保留空白的距离。
<frame> 参数设定：
例子：<frame name=”top” src=”a.html” marginwidth=”5″ marginheight=”5″ scrolling=”Auto” frameborder=”0″ noresize framespacing=”6″ bordercolor=”#0000FF”>
SRC=”a.html”
设定此框窗中要显示的网页档案名称，每个框窗一定要对应著一个网页档案。你可 使用绝对路径或相对路径，
NAME=”top”
设定这个框窗的名称，这样才能指定框架来作连结，必须但任意命名。
frameborder=0
设定框架的边框，其值只有 0 和 1 ， 0 表示不要边框， 1 表示要显示边框。（避 免使用 yes 或 no ）
framespacing=”6″
表示框架与框架间的保留空白的距离。
bordercolor=”#008000″
设定框架的边框颜色。颜色值请参考【HTML 剖析】。
scrolling=”Auto”
设定是否要显示卷轴，YES 表示要显示卷轴，NO 表示无论如何都不要显示， AUTO是视情况显示。
noresize
设定不让使用者可以改变这个框框的大小，亦没有设定此参数，使用者可以很随 意地拉动框架，改变其大小。
marginhight=5
表示框架高度部份边缘所保留的空间。
marginwidth=5
表示框架宽度部份边缘所保留的空间。
<noframes>
<body>
很抱歉，馈下使用的浏览器不支援框架功能，请转用新的浏览器。
</body>
</noframes>
<iframe> 的参数设定如下：
<iframe src=”iframe.html” name=”test” align=”MIDDLE” width=”300″ height=”100″ marginwidth=”1″ marginheight=”1″ frameborder=”1″ scrolling=”Yes”>
src=”iframe.html”
欲显示於此框窗的文件来源除档案名称，必要加上相对或绝对路径。
name=”test”
此框窗名称，这是连结标记的 target 参数所 要的，
align=”MIDDLE”
可选值为 left, right, top, middle, bottom，作用不大
width=”300″ height=”100″
框窗的宽及长，以 pixels 为单位。
marginwidth=”1″ marginheight=”1″
该插入的文件与框边所保留的空间。
frameborder=”1″
使用 1 表示显示边框， 0 则不显示。（可以是 yes 或 no）
scrolling=”Yes”
使用 Yes 表示容许卷动（内定）， No 则不容许卷动。
滚动字幕
<marquee align=″alignment″ behavior=″type″ bgcolor=″color″ direction=″direction″ scrollamount=″n″ scrolldelay=″n″ loop=″n″ width=″x″ height=″y″ hspace=″x″ vspace=″y″>滚动字幕内容</marquee>
align用来指定滚动字幕与左右文字的对齐方式，它的值可以有top、middle、bottom等；behavior用来指定滚动字幕的滚动方式，它的属性值有scroll、slide和alternate三个，scroll表示滚动字幕内容向同一方向重复滚动，slide表示滚动字幕内容从一端向另一端滚动并在另一端停止，alternate表示滚动字幕内容在两端之间来回往复滚动；direction指定滚动字幕的滚动方向，它的属性值有left\right\up\down，分别表示滚动字幕由右向左和由左向右滚动；scrollamount用来设置多次滚动之间的间隔距离，其单位是pixels（像素）；scrolldelay用来指定滚动字幕滚动一次所需要的时间，单位是ms（千分之一秒），其值的大小将直接影响滚动字幕的滚动速度;truespeed=milliseconds设定卷动速度;loop属性是用来指定滚动字幕的滚动次数的，当它的值为“－1”时，滚动字幕将连续滚动直到浏览器载入下一个页面；HSPACE和VSPACE则分别用来指定滚动字幕与其上一级页面在水平方向和竖直方向上的距离.
图片标记
<img> 的一般参数设定：
<img src=”logo.gif” width=100 height=100 hspace=5 vspace=5 border=2 align=”top” alt=”Logo of PenPals Garden” lowsrc=”pre_logo.gif”>
src=”logo.gif”
图片来源，接受 .gif, .jpg 及 .png 格式，前两者通行己久，后者由 96 年开始发展，于未来取代前两者。若图片文件与该 html 文件同处一目录则只写上文件案名称，否则 必须加上正确的途径，相对及绝对皆可。
width=100 height=100
设定图片大小，此宽度、及高度一般采用 pixels 作单位。通常只设为图片的真实 大小以免失真，若要改变图片大小最好事先使用图像编辑工具。
hspace=5 vspace=5
设定图片边沿空白，以免文字或其它图片过于贴近。hspace 是设定图片左右的空 间，vspace 则是设定图片上下的空间，高度采用 pixels 作单位。
border=2
图片边框厚度。
align=”top”
调整图片旁边文字的位置，你可以控制文字出现在图片的偏上方、中间、底端、 左右等，可选值：top, middle, bottom, left, right，内定为 botom。Netscape 还支持 texttop, baseline, absmiddle, absbottom，
texttop 表示图片和文字依顶线对
baseline 表示图片对到目前文字行底线值，
absmiddle 表示图片对到目前文字行绝对中央，
absbottom 表示图片对到目前文字行绝对底部，（绝对底部意指它考虑到比方 y 、g、q 等字的下缘）。
alt=”Logo of PenPal Garden”
这是用以描述该图形的文字，若用者使用文字浏览器，由于不支持图片，这些文 字更会代替图片而被显示。若于支持图片显示的浏览器，当鼠标移至图片上该些 文字亦会显示。
lowsrc=”pre_logo.gif”
设定先显示低解像图片，若所加入的是一张很大的图片，下载 时很长，这张低 解像图片会先被显示以免浏览失却兴趣，通当是原图片灰阶版本。
<img align=top|middle|center|bottom|left|right id=Value name=value src=url title=text alt=value border=n height=n Width=n hspace=n vspace=n ismap=image usemap=url onload=function onabort=function onerror=function dynsrc=url Controls=controls loop=n start=type>
title：设定图像的标题。
alt：表示图像的替代字，主要用于在浏览器还没有装入图像（或关闭图像显示）的时候，先显示有关此图像的信息。
ismp和usemap：在应用图像地图时使用。ismap表示图像地图的数据存放在服务器中，当鼠标在图像上的某个区域上时，可以将此区域的坐标传送给服务器处理。usemap则用于设定图像地图的名称。
onload、onabort、onerror对应于设定的子程序，分别在图像被载入、取消载入、载入出错的情况下各自对应的子程序，不常用。
dynsrc：指定要下载的影像片断的url地址。
controls：设定影像播放的控制接钮。
loop：指定影像片断的播放次数，当loop=-1时，影像片断将循环播放直至页面更新。
start：设定何时开始播放影像片断，有三种选择：start=fileopen表示页面载入后即开始播放，默认的就是这种状态；start=mouseover表示当鼠标移到影像上即开始播放；start=fileopen,mouseover表示当有上面两种情况之一发生时就开始播放。
<img src=”image/htmlp1.gif” width=”182″ height=”129″ align=”left” name=”hscfjj” onmouseover=”hscfjj.src=’image/htmlp2.gif'” onmouseout=”hscfjj.src=’image/htmlp1.gif'” alt=”黄山村夫站（[url]http://fym888.go.163.com[/url])简介图片” vspace=”10″ hspace=”10″>
<area id＝Value href＝url alt＝text shape＝area-shape coods＝value>
alt：用于设定热点的替代性文字。
href：用于设定该热点所链接的url地址。
shape和coords：是两个主要的参数，用于设定热点的形状和大小。其基本用法如下：
<area shape=”rect” coords=”x1, y1,x2,y2 href=url>”表示设定热点的形状为矩形，左上角顶点坐标为（X1,y1），右下角顶点坐标为（X2,y2）。
<area shape=”circle” coords=”x1, y1,r” href=url>表示设定热点的形状为圆形，圆心坐标为（X1,y1），半径为r。
<area shape=”poligon” coords=”x1, y1,x2,y2 ……” href=url>表示设定热点的形状为多边形，各顶点坐标依次为（X1,y1）、（X2,y2）、（x3,y3） ……。
<area>标记是在图像地图中划分作用区域的，因此其划分的作用区域必须在图像地图的区域内，所以在用 <area>标记划分区域前必须用HTML的另一个标记<map>来设定图像地图的作用区域，并为指定的图像地图设定名称，该标记的用法很简单，即<map name=”图像地图名称”> …… </map>。设定地图
<img BORDER=0 SRC=A.GIF USEMAP=#A>
<map NAME=A>
<area SHAPE=RECT COORDS=0,0,200,100 HREF=1.HTM>
<area SHAPE=RECT COORDS=0,100,200,200 NOHREF>
<area SHAPE=RECT COORDS=0,200,200,300 HREF=3.HTM>
</map>
标记 类型 译名或意义 作 用 备注
文件标记
<html> ● 文件声明 让浏览器知道这是 HTML 文件
<head> ● 开头 提供文件整体资讯
<title> ● 标题 定义文件标题，将显示于浏览顶端
<body> ● 本文 设计文件格式及内文所在
排版标记
<!–注解–> ○ 说明标记 为文件加上说明，但不被显示
<p> ○ 段落标记 为字、画、表格等之间留一空白行
<br /> ○ 换行标记 令字、画、表格等显示于下一行
<hr /> ○ 水平线 插入一条水平线
<center> ● 居中 令字、画、表格等显示于中间 反对
<pre> ● 预设格式 令文件按照原始码的排列方式显示
<div> ● 区隔标记 设定字、画、表格等的摆放位置
<nobr> ● 不折行 令文字不因太长而绕行
<wbr> ● 建议折行 预设折行部位
字体标记
<strong> ● 加重语气 产生字体加粗 Bold 的效果
<b> ● 粗体标记 产生字体加粗的效果
<em> ● 强调标记 字体出现斜体效果
<i> ● 斜体标记 字体出现斜体效果
<tt> ● 打字字体 Courier字体字母宽度相同
<u> ● 加上底线 加上底线 反对
<h1> ● 一级标题标记 变粗变大加宽，程度与级数反比
<h2> ● 二级标题标记 将字体变粗变大加宽
<h3> ● 三级标题标记 将字体变粗变大加宽
<h4> ● 四级标题标记 将字体变粗变大加宽
<h5> ● 五级标题标记 将字体变粗变大加宽
<h6> ● 六级标题标记 将字体变粗变大加宽
<font> ● 字形标记 设定字形、大小、颜色 反对
<basefont> ○ 基准字形标记 设定所有字形、大小、颜色 反对
<big> ● 字体加大 令字体稍为加大
<small> ● 字体缩细 令字体稍为缩细
<strike> ● 画线删除 为字体加一删除线 反对
<code> ● 程式码 字体稍为加宽如<tt>
<kbd> ● 键盘字 字体稍为加宽，单一空白
<samp> ● 范例 字体稍为加宽如<tt>
<var> ● 变数 斜体效果
<cite> ● 传记引述 斜体效果
<blockquote> ● 引述文字区块 缩排字体
<dfn> ● 述语定义 斜体效果
<address> ● 地址标记 斜体效果
<sub> ● 下标字 指数
<sup> ● 下标字 下标字
清单标记
<ol> ● 顺序清单 清单项目将以数字、字母顺序排列
<ul> ● 无序清单 清单项目将以圆点排列
<li> ○ 清单项目 每一标记标示一项清单项目
<menu> ● 选单清单 清单项目将以圆点排列，如<ul> 反对
<dir> ● 目录清单 清单项目将以圆点排列，如<ul> 反对
<dl> ● 定义清单 清单分两层出现
<dt> ○ 定义条目 标示该项定义的标题
<dd> ○ 定义内容 标示定义内容
表格标记
<table> ● 表格标记 设定该表格的各项参数
<caption> ● 表格标题 做成一打通列以填入表格标题
<tr> ● 表格列 设定该表格的列
<td> ● 表格栏 设定该表格的栏
<th> ● 表格标头 相等于<td>，但其内之字体会变粗
表单标记
<form> ● 表单标记 决定单一表单的运作模式
<textarea> ● 文字区块 提供文字方盒以输入较大量文字
<input> ○ 输入标记 决定输入形式
<select> ● 选择标记 建立 pop-up卷动清单
<option> ○ 选项 每一标记标示一个选项
图形标记
<img> ○ 图形标记 用以插入图形及设定图形属性
连结标记
<a> ● 连结标记 加入连结
<base> ○ 基准标记 可将相对 URL 转绝对及指定连结目标
框架标记
<frameset> ● 框架设定 设定框架
<frame> ○ 框窗设定 设定框窗
<iframe> ○ 页内框架 于网页中间插入框架 IE
<noframes> ● 不支援框架 设定当浏览器不支援框架时的提示
影像地图
<map> ● 影像地图名称 设定影像地图名称
<area> ○ 连结区域 设定各连结区域
多媒体
<bgsound> ○ 背景声音 于背景播放声音或音乐 IE
<embed> ○ 多媒体 加入声音、音乐或影像
其他标记
<marquee> ● 走动文字 令文字左右走动 IE
<blink> ● 闪烁文字 闪烁文字 NC
<isindex> ○ 页内寻找器 可输入关键字寻找于该一页 反对
<meta> ○ 开头定义 让浏览器知道这是 HTML 文件
<link> ○ 关系定义 定义该文件与其他 URL 的关系
StyleSheet
<style> ● 样式表 控制网页版面
<span> ● 自订标记 独立使用或与样式表同用
注：
? ● 表示该标记属围堵标记，即需要关闭标记如 </标记>。
? ○ 表示该标记属空标记，即不需要关闭标记。
? IE 表示该标记只适用于 Internet Explorer。
? NC 表示该标记只适用于 Netscape Communicator。
? 反对 表示该标记不为 W3C 所赞同，通常这标记是 IE 或 NC 自订，且己为众所支 持，只是 HTML 标准中有其它同功能或更好的选择。
? 弃用 表示该标记己为 W3C 所弃用，是过时的标记，但 HTML 具向下兼容的特 性，不用担心新浏览器不支援旧标记。
? 新 表示该标记是 HTML 4.0 中新增的。
一些脚本
onchange=”location.href=this.options[this.selectedIndex].value
parent.mainFrame :parent.mainFrame.htest()”>
<a HREF=”http://twinsen.163.net” OnmouseOver=”
window.status=’TWINSEN主页’;return true;” OnMouseOut=”window.status=’ ‘;”〉
开启新窗口
<a HREF=”twinsen.163.net” target=”resource window”>
CSS定义字体的标签元素
font-family: 设置字体字族。
font-sytle:设置字体类型。
font-weight:设置字体的字重
font-size:设置字体大小。
font-decoration:修饰文本字体，比如带下划线“underline”。
这可以利用Input对象的一个属性（style）来控制，这个属性是ime-mode，在设定一个输入框的时候，只要设定该输入框的ime-mode属性为disabled，当输入框获得输入焦点时，就会自动关闭输入法。
<input name=email style=’ime-mode:disabled’ size=15>
SSI全称是Server-Side Include，即服务器端嵌入。在DreamWeaver中选择“InsertàServer-side Include”，选定要插入的文件即可，非常简单吧！源代码更简单到只有一行：<!–#include virtual=” url ” –>
同时切记要把文件名后缀设为.shtm 或.shtml才会有效果。
<!–#echo var=”DATE_LOCAL”–>
<!–#include file=”news.txt”–>
<!–#flastmod file=”news.txt”–>
< style type=”text/css”>
< !–
样式表的具体内容
–>
< /style>
< link rel=”stylesheet” href=”*.css” type=”text/css” media=”screen”>
< style type=”text/css”>
< !–
@import “*.css”
其他样式表的声明
–>
< /style>
font-family: 字体名称
font-size: 字号参数
font-style: 斜体字的名称
font-weight: 字体粗细
text-transform: 文字大小写
参数取值范围：
?uppercase：所有文字大写显示
?lowercase：所有文字小写显示
?capitalize：每个单词的头字母大写显示
?none：不继承母体的文字变形参数
text-decoration: 文字修饰
参数取值范围：
?underline：为文字加下划线
?overline：为文字加上划线
?line-through：为文字加删除线
?blink：使文字闪烁
?none：不显示上述任何效果
word-spacing: 单词间距
间隔距离的取值：points、em、pixes、in、cm、mm、pc、ex、normal等
letter-spacing: 字母间距
line-height: 行间距离
text-align: 文本水平对齐(块级属性)
参数的取值:
?left：左对齐
?right：右对齐
?center：居中对齐
?justify：相对左右对齐
vertical-align: 文本垂直对齐
参数取值：
?top：顶对齐
?bottom：底对齐
?text-top：相对文本顶对齐
?text-bottom：相对文本底对齐
?baseline：基准线对齐
?middle：中心对齐
?sub：以下标的形式显示
?super：以上标的形式显示
text-indent: 缩进距离(块级属性)
color: 参数
background-color: 背景颜色
background-image: url(URL)背景图片
背景图片重复
背景图片重复控制的是背景图片平铺与否，也就是说，结合背景定位的控制可以在网页上的某处单独显示一幅背景图片。
background-repeat: 参数
?no-repeat：不重复平铺背景图片
?repeat-x：使图片只在水平方向上平铺
?repeat-y：使图片只在垂直方向上平铺
如果不指定背景图片重复属性，浏览器默认的是背景图片向水平、垂直两个方向上平铺。
background-attachment: 背景图片固定
?fixed：网页滚动时，背景图片相对于浏览器的窗口而言，固定不动
?scroll：网页滚动时，背景图片相对于浏览器的窗口而言，一起滚动
background-position: 背景定位
?带长度单位的数字参数
?top：相对前景对象顶对齐
?bottom：相对前景对象底对齐
?left：相对前景对象左对齐
?right：相对前景对象右对齐
?center：相对前景对象中心对齐
?比例关系
list-style-type：列表符号
?disc：圆形
?circle：空心圆
?square：方块
?decimal：十进制数字
?lower-roman：小写罗马数字
?upper-roman：大写罗马数字
?lower-alpha：小写希腊字母
?upper-alpha：大写希腊字母
?none：无符号显示
list-style-image：URL图形符号
list-style-position：列表位置
?inside：在BOX模型内部显示
?outside：在BOX模型外部显示
cursor：鼠标形状参数
hand手形crosshair十字形text文本形
wait沙漏形move十字箭头形help问号形
e-resize右箭头形n-resize上箭头形
nw-resize左上箭头形w-resize左箭头形
s-resize下箭头形se-resize右下箭头形
sw-resize左下箭头形
控制BOX的样式
样式表规定了一个容器BOX，它将要储存一个对象的所有可操作的样式。包括了对象本身、边框空白、对象边框、对象间隙四个方面。
边框空白（MARGIN）
?margin-top：顶部空白距离
?margin-right：右边空白距离
?margin-bottom：底部空白距离
?margin-left：左边空白距离
对象边框（BORDER）
?border-top：顶边框宽度
?border-right：右边框宽度
?border-bottom：底边框宽度
?border-left：左边框宽度
?border-width：所有边框宽度
?border-color：边框颜色
?border-style：边框样式参数
?none：无边框。
?dotted：边框为点线。
?dashed：边框为长短线。
?solid：边框为实线。thin细线medium中粗线thick粗线1pt、5px、2cm
?double：边框为双线。
?groove：根据color属性显示不同效果的3D边框
?ridge：根据color属性显示不同效果的3D边框
?inset：根据color属性显示不同效果的3D边框
?outset：根据color属性显示不同效果的3D边框
对象间隙（PADDING）
?padding-top：顶部间隙
?padding-right：右边间隙
?padding-bottom：底部间隙
?padding-left：左边间隙
显示控制样式
display: 参数
?block（默认）：在对象前后都换行
?inline：在对象前后都不换行
?list-item：在对象前后都换行，增加了项目符号
?none：无显示
空白控制样式(块级属性)
white-space: 参数
normal：把多个空格替换为一个来显示
pre：忠实地按输入显示空格
nowrap：禁止换行
writing-mode（设置对象书写方向）
writing-mode : lr-tb、tb-rl
lr-tb：从左向右，从上往下
tb-rl：从上往下，从右向左
示例：div { writing-mode: tb-rl; }
text-align（设置对象中文本的对齐方式
text-align : left、right、center、justify
left：左对齐 right：右对齐
center：居中 justify：两端对齐
示例：div { text-align : center; }
一般事件
onClick 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击
onDblClick 鼠标双击事件
onMouseDown 鼠标上的按钮被按下了
onMouseUp 鼠标按下后，松开时激发的事件
onMouseOver 当鼠标移动到某对象范围的上方时触发
onMouseMove 鼠标移动时触发的事件
onMouseOut 当鼠标离开某对象范围时触发的事件
onKeyPress 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象]
onKeyDown HTML: 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象]
onKeyUp HTML: 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象]
页面相关事件
onAbort 图片在下载时被用户中断
onBeforeUnload 当前页面的内容将要被改变时触发的事件
onError 捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误
onLoad 页面内空完成传送到浏览器时触发的事件，包括外部文件引入完成
onMove 浏览器的窗口被移动时触发的事件
onResize 当浏览器的窗口大小被改变时触发的事件
onScroll 浏览器的滚动条位置发生变化时触发的事件
onStop 浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断
onUnload 当前页面将被改变时触发的事件
表单相关事件
onBlur 当前元素失去焦点时触发的事件 [鼠标与键盘的触发均可]
onChange 当前元素失去焦点并且元素的内容发生改变而触发的事件 [鼠标与键盘的触发均可]
onFocus 当某个元素获得焦点时触发的事件
onReset 当表单中RESET的属性被激发时触发的事件
onSubmit 一个表单被递交时触发的事件
滚动字幕事件
onBounce 在Marquee内的内容移动至Marquee显示范围之外时触发的事件
onFinish 当Marquee元素完成需要显示的内容后触发的事件
onStart 当Marquee元素开始显示内容时触发的事件
编辑事件
onBeforeCopy 当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发的事件
onBeforeCut 当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发的事件
onBeforeEditFocus 当前元素将要进入编辑状态
onBeforePaste 内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件
onBeforeUpdate 当浏览者粘贴系统剪贴板中的内容时通知目标对象
onContextMenu 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件 [试试在页面中的<body>中加入onContentMenu=”return false”就可禁止使用鼠标右键了]
onCopy 当页面当前的被选择内容被复制后触发的事件
onCut 当页面当前的被选择内容被剪切时触发的事件
onDrag 当某个对象被拖动时触发的事件 [活动事件]
onDragDrop 一个外部对象被鼠标拖进当前窗口或者帧
onDragEnd 当鼠标拖动结束时触发的事件，即鼠标的按钮被释放了
onDragEnter 当对象被鼠标拖动的对象进入其容器范围内时触发的事件
onDragLeave 当对象被鼠标拖动的对象离开其容器范围内时触发的事件
onDragOver 当某被拖动的对象在另一对象容器范围内拖动时触发的事件 [活动事件]
onDragStart 当某对象将被拖动时触发的事件
onDrop 在一个拖动过程中，释放鼠标键时触发的事件
onLoseCapture 当元素失去鼠标移动所形成的选择焦点时触发的事件
onPaste 当内容被粘贴时触发的事件
onSelect 当文本内容被选择时的事件
onSelectStart 当文本内容选择将开始发生时触发的事
数据绑定
onAfterUpdate 当数据完成由数据源到对象的传送时触发的事件
onCellChange 当数据来源发生变化时
onDataAvailable 当数据接收完成时触发事件
onDatasetChanged 数据在数据源发生变化时触发的事
onDatasetComplete 当来子数据源的全部有效数据读取完毕时触发的事件
onErrorUpdate 当使用onBeforeUpdate事件触发取消了数据传送时，代替onAfterUpdate事件
onRowEnter 当前数据源的数据发生变化并且有新的有效数据时触发的事件
onRowExit 当前数据源的数据将要发生变化时触发的事件
onRowsDelete 当前数据记录将被删除时触发的事件
onRowsInserted 当前数据源将要插入新数据记录时触发的事件
外部事件
onAfterPrint 当文档被打印后触发的事件
onBeforePrint 当文档即将打印时触发的事件
onFilterChange 当某个对象的滤镜效果发生变化时触发的事件
onHelp 当浏览者按下F1或者浏览器的帮助选择时触发的事件
onPropertyChange 当对象的属性之一发生变化时触发
onReadyStateChange 当对象的初始化属性值发生变化时触发