http://www.sortol.com http://www.sortol.com/images/logo.gif HTML教程--asp.net教程网 http://www.sortol.com zh-cn www.sortol.com

嵌入多媒体文本(EMBED)
  基本语法 <embed src=#> #=URL
本标记可以用来在主页中嵌入多媒体文本，如：
电影(movie), 声音(sound), 虚拟现实语言(vrml)... ...
体会 <embed> 标记，您需要把 plugin 安装完备。
请注意：embed attributes are different between each plugins.
背景音乐
  <bgsound src=#> #=WAV 文件的 URL
<bgsound loop=#> #=循环数 <bgsound src="sound.wav" loop=3>
示例
插入视频剪辑
  <img src="url.gif" dynsrc="url.avi">用 url.avi 这一 AVI(Video for MS－WINDOWS) 文件来播放视频；
用 url.gif 这一 GIF 图象作为视频的封面，即：在浏览器
尚未完全读入 AVI 文件时，先在 AVI 播放区域显示该图象。
<img src="SAMPLE-S.GIF" dynsrc="SAMPLE-S.AVI">

何时开始播放 AVI <img start=#> #=fileopen, mouseover
缺省值是 #=fileopen，即在链接到含本标记的页面(如本页)时开始播放 AVI。
mouseover 是指您把鼠标移到 AVI 播放区域之上时才开始播放 AVI。
也可以两者同时设置：<img start=fileopen,mouseover>
另外，用鼠标在 AVI 播放区域点击一下，也将令浏览器开始播放该 AVI。
<img src="SAMPLE-S.GIF" dynsrc="SAMPLE-S.AVI" start=mouseover>

  控制条 <img controls>用来在视频窗口下附加 MS－WINDOWS 的 AVI 播放控制条。 <img src="SAMPLE-S.GIF" dynsrc="SAMPLE-S.AVI" controls>

  循环播放 <img loop=#>
<loop=infinite> 将循环播放不止。
<img src="SAMPLE-S.GIF" dynsrc="SAMPLE-S.AVI" loop=3>

  延时 <img loopdelay=#> #=毫秒数 <img src="/images/logo.GIF" dynsrc="SAMPLE-S.AVI" loop=3 loopdelay=250>
  asp.net教程]]> asp.net教程]]>

表格的色彩
  表元的背景色彩和背景图象
<th bgcolor=#>
<th background="URL"> #=rrggbb 16 进制 RGB 数码, 或者是下列预定义色彩名称：
Black, Olive,Teal, Red, Blue,Maroon, Navy,Gray, Lime,
Fuchsia, White,Green, Purple,Silver, Yellow,Aqua <table border><tr><th bgcolor=ffaa00>Food</th> <th bgcolor=Red>Drink</th> <th rowspan=2 background="image.gif">Sweet</th><tr bgcolor=white><td>A</td><td>B</td></table> Food Drink Sweet A B
  表格边框的色彩
<table bordercolor=#><table cellspacing=5 border=5 bodercolor=#ffaa00><tr><th>Food</th><th>Drink</th><th>Sweet</th><tr><td>A</td><td>B</td><td>C</td> </table> Food Drink Sweet A B C
  表格边框色彩的亮度控制
<table bordercolorlight=#>
<table bordercolordark=#> <table cellspacing=5 border=5 bordercolorlight=White bordercolordark=Maroon><tr><th>Food</th><th>Drink</th><th>Sweet</th><tr><td>A</td><td>B</td><td>C</td> </table> Food Drink Sweet A B C
表格的分组显示(Structured Table)
  按行分组
<thead> ... </thead> - 表的题头(Header)
<tbody> ... </tbody> - 表的正文(Body)
<tfoot> ... </tfoot> - 表的脚注(Footer) <table border><thead> <tr><th>Food</th><th>Drink</th><th>Sweet</th></thead><tbody> <tr><td>A</td><td>B</td><td>C</td> <tr><td>D</td><td>E</td><td>F</td></tbody></table>

Food Drink Sweet A B C D E F
  按列分组
<colgroup align=#> #=left, right, center <table border width=160><colgroup align=left><colgroup align=center><colgroup align=right> <thead> <tr><th>Food</th><th>Drink</th><th>Sweet</th> </thead> <tbody> <tr><td>A</td><td>B</td><td>C</td> <tr><td>D</td><td>E</td><td>F</td> </tbody></table>

Food Drink Sweet A B C D E F
  列的属性控制
<col span=#> #=从左数起，具有指定属性的列的列数
<col align=#> #=left, right, center <table border width=160><colgroup> <col align=center span=2><colgroup align=right> <thead> <tr><th>Food</th><th>Drink</th><th>Sweet</th> </thead> <tbody> <tr><td>A</td><td>B</td><td>C</td> <tr><td>D</td><td>E</td><td>F</td> </tbody></table>

Food Drink Sweet A B C D E F
表格中边框的显示
  显示所有 4 个边框 <table frame=box><table border frame=box><thead> <tr><th>Food</th><th>Drink</th><th>Sweet</th></thead><tbody> <tr><td>A</td><td>B</td><td>C</td> <tr><td>D</td><td>E</td><td>F</td></tbody></table>

Food Drink Sweet A B C D E F
  只显示上边框 <table frame=above>

Food Drink Sweet A B C D E F
  只显示下边框 <table frame=below>

Food Drink Sweet A B C D E F
  只显示上、下边框 <table frame=hsides>

Food Drink Sweet A B C D E F
  只显示左、右边框 <table frame=vsides>

Food Drink Sweet A B C D E F
  只显示左边框 <table frame=lhs>

Food Drink Sweet A B C D E F
  只显示右边框 <table frame=rhs>

Food Drink Sweet A B C D E F
  不显示任何边框 <table frame=void>

Food Drink Sweet A B C D E F
表格中分隔线(Rules)的显示
  显示所有分隔线 <table rules=all> <table border rules=all><colgroup><col align=center span=2><colgroup align=right> <thead> <tr><th>Food</th><th>Drink</th><th>Sweet</th> </thead> <tbody> <tr><td>A</td><td>B</td><td>C</td> <tr><td>D</td><td>E</td><td>F</td> </tbody> <tbody> <tr><td rowspan=3 align=right>Total $-00.0</td> </tbody></table>

Food Drink Sweet A B C D E F Total $-00.0
  只显示组(Groups)与组之间的分隔线 <table rules=groups>

Food Drink Sweet A B C D E F Total $-00.0
  只显示行与行之间的分隔线 <table rules=rows>

Food Drink Sweet A B C D E F Total $-00.0
  只显示列与列之间的分隔线 <table rules=cols>

Food Drink Sweet A B C D E F Total $-00.0
  不显示任何分隔线 <table rules=none>

Food Drink Sweet A B C D E F Total $-00.0   asp.net教程]]> asp.net教程]]>

基本语法
  表单的基本语法 <form action="url" method=*>
...
...
<input type=submit> <input type=reset>
</form>
*=GET, POST
  表单中提供给用户的输入形式 <input type=* name=**>
*=text, password, checkbox, radio, image, hidden, submit, reset
**=Symbolic Name for CGI script
文字输入和密码输入
*=text, password <input type=*>
<input type=* value=**><form action=/cgi-bin/post-query method=POST>您的姓名: <input type=text name=姓名><br>您的主页的网址: <input type=text name=网址 value=http://><br>密码: <input type=password name=密码><br><input type=submit value="发送"><input type=reset value="重设"></form>
您的姓名:
您的主页的网址:
密码:


  <input type=* size=**>
<input type=* maxlength=**><form action=/cgi-bin/post-query method=POST><input type=text name=a01 size=40><br><input type=text name=a02 maxlength=5><br><input type=submit><input type=reset></form>




复选框(Checkbox) 和 单选框(RadioButton)
  <input type=checkbox>
<input type=checkbox checked>
<input type=checkbox value=**><form action=/cgi-bin/post-query method=POST><input type=checkbox name=水果1> Banana<p><input type=checkbox name=水果2 checked> Apple<p><input type=checkbox name=水果3 value=橘子> Orange<p><input type=submit><input type=reset></form>
Banana

Apple
Orange


  <input type=radio value=**>
<input type=radio value=** checked><form action=/cgi-bin/post-query method=POST><input type=radio name=水果> Banana<p><input type=radio name=水果 checked> Apple<p><input type=radio name=水果 value=橘子> Orange<p><input type=submit><input type=reset></form>
Banana

Apple
Orange


图象坐标
在下面选则一个系数后，在图象上点一下，就知道什么是图象坐标了！ <input type=image src=url><form action=/cgi-bin/post-query method=POST><input type=image name=face src=f.gif><p><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>


x2 x4x6


隐藏表单的元素 <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=submit><input type=reset></form>
Hereis a hidden element.



列表框(Selectable Menu)
  基本语法 <select name=*>
<option> ...
</select>
  <option selected>
<option value=**><form action=/cgi-bin/post-query method=POST><select name=fruits> <option>Banana <option selected>Apple <option value=My_Favorite>Orange</select><p><input type=submit><input type=reset></form>
BananaAppleOrange



  <select size=**><form action=/cgi-bin/post-query method=POST><select name=fruits size=3> <option>Banana <option selected>Apple <option value=My_Favorite>Orange <option>Peach</select><p><input type=submit><input type=reset></form>
BananaAppleOrangePeach



  <select size=** multiple>注意，是用 Ctrl 键配合鼠标实现多选。
(和 MS-WINDOWS 的 File Manager 一样)<form action=/cgi-bin/post-query method=POST><select name=fruits size=3 multiple> <option selected>Banana <option selected>Apple <option value=My_Favorite>Orange <option selected>Peach</select><p><input type=submit><input type=reset></form>
BananaAppleOrangePeach



文本区域 <textarea name=* rows=** cols=**> ... <textarea><form action=/cgi-bin/post-query method=POST><textarea name=comment rows=5 cols=60></textarea><P><input type=submit><input type=reset></form>




对于很长的行是否进行换行的设置(Word Wrapping) <textarea wrap=off> ... </textarea> 不换行，是缺省设置。
  <textarea wrap=soft> ... </textarea>“软换行”，好象 MS－WORD 里的“软回车”。 <form action=/cgi-bin/post-query method=POST>
<textarea wrap=soft name=comment rows=5 cols=25> </textarea><P>
<input type=submit><input type=reset>
</form>





  <textarea wrap=hard> ... </textarea>“硬换行”，好象 MS－WORD 里的“硬回车”。 <form action=/cgi-bin/post-query method=POST>
<textarea wrap=hard name=comment rows=5 cols=25> </textarea><P>
<input type=submit><input type=reset>
</form>



  asp.net教程]]> asp.net教程]]> asp.net教程]]> asp.net教程]]>

HTML 文件结构(Document Structures) <html>...</html>
<head>...</head>
<body>...</body> <HTML><HEAD> <title>, <base>, <link>, <isindex>, <meta></HEAD><BODY> HTML 文件的正文写在这里... ... </BODY></HTML>
语言字符集(Charsets)的信息 <meta http-equiv="Content-Type" content="text/html;charset=#">
#= us-ascii, iso-8859-1, x-mac-roman, iso-8859-2, x-mac-ce,
iso-2022-jp, x-sjis, x-euc-jp,
euc-kr, iso-2022-kr,
gb2312, gb_2312-80,
x-euc-tw, x-cns11643-1, x-cns11643-2, big5
可在 HTML 文件中设置 MIME 字符集信息。
您在浏览主页时，最好自己在浏览器的选项菜单内选择相应的语言(language encoding)。
但是如果 HTML 文件里写明了设置，浏览器就会自动设置语言选项。
尤其是主页里用到了字符实体(entities)，则该主页就应该写明字符集信息。
否则，您在浏览该主页时，若未正确设置语言选项，显示将可能混乱。
背景色彩和文字色彩 <body bgcolor=# text=# link=# alink=# vlink=#> bgcolor --- 背景色彩 text --- 非可链接文字的色彩 link --- 可链接文字的色彩 alink --- 正被点击的可链接文字的色彩 vlink --- 已经点击(访问)过的可链接文字的色彩 #=rrggbb 色彩是用 16 进制的 红－绿－蓝(red-green-blue, RGB) 值来表示。
16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.
背景图象 <body background="image-URL">
Non Scrolling Background <body bgproperties=FIXED>
页面空白(Margin)
  页面左边的空白 <body leftmargin=#>
页面上方的空白(天头) <body topmargin=#> #=margin amount
链接(Link)
  基本语法 <a href="URL"> ... </a> 这是一个
<a href="samp/link.html">链接的例子</a>。
点一下带下划线的文字!

这是一个 链接的例子。 点一下带下划线的文字!

  跳转到页面的另外一个地方
<a href="#name"> ... </a>
<a name="name"> ... </a> <a href="#jump-test">跳转到下一个"链接点"</a><P>
<a name="jump-test">下一个链接点</a>
跳转到下一个"链接点"
下一个链接点
跳转到另一个页面的某个地方
<a href="URL#name"> ... </a>
<a name="name"> ... </a> 跳转到另一个页面的<a href="samp/link.html#jump-test">某个地方</a>。

跳转到另一个页面的某个地方。
开一个新的(浏览器)窗口 (Target Window)
  <a href="URL" target="Window_Name"> ... </a> <a href="samp/window.html" target="window_name">
开一个新窗口!
</a>
开一个新窗口!
标尺线 <hr>
<hr>

<hr size=#>
<hr size=10>

<hr width=#>
<hr width=50>
<hr width=50%>

<hr align=#> #=left, right
<hr width=50% align=left>
<hr width=50% align=right>

<hr noshade>
<hr noshade>

<hr color=#> #=rrggbb 16 进制 RGB 数码，或者是下列预定义色彩：
Black, Olive,Teal, Red, Blue,Maroon, Navy,Gray, Lime,
Fuchsia, White,Green, Purple,Silver, Yellow,Aqua
<hr color="red">
  asp.net教程]]>   标题字体(Header)<h#> ... </h#> #=1, 2, 3, 4, 5, 6<h1>今天天气真好！</h1> 今天天气真好！<h2>今天天气真好！</h2> 今天天气真好！<h3>今天天气真好！</h3> 今天天气真好！<h4>今天天气真好！</h4> 今天天气真好！<h5>今天天气真好！</h5> 今天天气真好！<h6>今天天气真好！</h6> 今天天气真好！<hn>---</hn> 这些标记显示黑体字。<hn>---</hn> 这些标记自动插入一个空行，不必用 <p>标记再加空行。
因此在一行中无法使用不同大小的字体。
字体大小 <font size=#> ... </font> #=1, 2, 3, 4, 5, 6, 7 or +#,-#
<basefont size=#> #=1, 2, 3, 4, 5, 6, 7
<font size=7>今天天气真好！</font> 今天天气真好！
<font size=6>今天天气真好！</font> 今天天气真好！
<font size=5>今天天气真好！</font> 今天天气真好！
<font size=4>今天天气真好！</font> 今天天气真好！
<font size=3>今天天气真好！</font> 今天天气真好！
<font size=2>今天天气真好！</font> 今天天气真好！
<font size=1>今天天气真好！</font> 今天天气真好！

物理字体(Physical Style)
<b>今天天气真好！</b> 今天天气真好！
<i>今天天气真好！</i> 今天天气真好！
<u>今天天气真好！</u> 今天天气真好！
<tt>今天天气真好！</tt> 今天天气真好！
^{今天天气真好！} 今天天气真好！
_{今天天气真好！} 今天天气真好！
<s>今天天气真好！</s> 今天天气真好！
<strike>今天天气真好！</strike> 今天天气真好！

逻辑字体(Logical Style)
<em>今天天气真好！</em> 今天天气真好！
<strong>今天天气真好！</strong> 今天天气真好！
<code>今天天气真好！</code> 今天天气真好！
<samp>今天天气真好！</samp> 今天天气真好！
<kbd>今天天气真好！</kbd> 今天天气真好！
<var>今天天气真好！</var> 今天天气真好！
<dfn>今天天气真好！</dfn> 今天天气真好！
<cite>今天天气真好！</cite> 今天天气真好！
<small>今天天气真好！</small> 今天天气真好！
<big>今天天气真好！</big> 今天天气真好！

指定“字体大小”的标记和“指定字体”的标记的组合使用<i><font size=5> <b>今天</b> 天气<font size=6> 真好！</font></font></i>
今天 天气 真好！
字体颜色
 指定颜色 <font color=#> ... </font>#=rrggbb 16 进制数码，或者是下列预定义色彩：
Black, Olive,Teal, Red, Blue,Maroon, Navy,Gray, Lime,
Fuchsia, White,Green, Purple,Silver, Yellow,Aqua
<font color=ffffff>White</font> &
<font color=white>White</font>
White & White
客户端字体(Font Face)
 <font face="#, #, ..., #"> ... </font>
#=客户端可获得的字体
<font face="Arial, Helvetica"> Hellow World!</font>
Hellow World! 客户端字体(Font Face)示例
字符实体(Entities)
 &#; #=字符实体名称 或者 ascii 值HTML2.0 的字符集&amp; &&lt; <&gt; >&quot; "HTML2.0 字符实体名称列表HTML3.2 字符实体名称列表ISO 字符实体名称列表   asp.net教程]]>

HTML 文件结构(Document Structures)<html>...</html>
<head>...</head>
<body>...</body><HTML><HEAD> <title>, <base>, <link>, <isindex>, <meta></HEAD><BODY> HTML 文件的正文写在这里... ... </BODY></HTML>
语言字符集(Charsets)的信息 <meta http-equiv="Content-Type" content="text/html;charset=#">
#= us-ascii, iso-8859-1, x-mac-roman, iso-8859-2, x-mac-ce,
iso-2022-jp, x-sjis, x-euc-jp,
euc-kr, iso-2022-kr,
gb2312, gb_2312-80,
x-euc-tw, x-cns11643-1, x-cns11643-2, big5
可在 HTML 文件中设置 MIME 字符集信息。
您在浏览主页时，最好自己在浏览器的选项菜单内选择相应的语言(language encoding)。
但是如果 HTML 文件里写明了设置，浏览器就会自动设置语言选项。
尤其是主页里用到了字符实体(entities)，则该主页就应该写明字符集信息。
否则，您在浏览该主页时，若未正确设置语言选项，显示将可能混乱。
背景色彩和文字色彩<body bgcolor=# text=# link=# alink=# vlink=#>bgcolor --- 背景色彩text --- 非可链接文字的色彩link --- 可链接文字的色彩alink --- 正被点击的可链接文字的色彩vlink --- 已经点击(访问)过的可链接文字的色彩#=rrggbb色彩是用 16 进制的 红－绿－蓝(red-green-blue, RGB) 值来表示。
16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.
背景图象 <body background="image-URL">
Non Scrolling Background <body bgproperties=FIXED>
页面空白(Margin)
 页面左边的空白 <body leftmargin=#>
页面上方的空白(天头) <body topmargin=#> #=margin amount
链接(Link)
 基本语法 <a href="URL"> ... </a>这是一个
<a href="samp/link.html">链接的例子</a>。
点一下带下划线的文字!

这是一个链接的例子。 点一下带下划线的文字!

 跳转到页面的另外一个地方
<a href="#name"> ... </a>
<a name="name"> ... </a> <a href="#jump-test">跳转到下一个"链接点"</a><P>
<a name="jump-test">下一个链接点</a>
跳转到下一个"链接点"
下一个链接点
跳转到另一个页面的某个地方
<a href="URL#name"> ... </a>
<a name="name"> ... </a> 跳转到另一个页面的<a href="samp/link.html#jump-test">某个地方</a>。

跳转到另一个页面的某个地方。
开一个新的(浏览器)窗口 (Target Window)
 <a href="URL" target="Window_Name"> ... </a><a href="samp/window.html" target="window_name">
开一个新窗口!
</a>
开一个新窗口!
标尺线<hr>
<hr>

<hr size=#>
<hr size=10>

<hr width=#>
<hr width=50>
<hr width=50%>

<hr align=#> #=left, right
<hr width=50% align=left>
<hr width=50% align=right>

<hr noshade>
<hr noshade>

<hr color=#> #=rrggbb 16 进制 RGB 数码，或者是下列预定义色彩：
Black, Olive,Teal, Red, Blue,Maroon, Navy,Gray, Lime,
Fuchsia, White,Green, Purple,Silver, Yellow,Aqua
<hr color="red">

  asp.net教程]]>
新添内容StyleSheet GuideStyle sheet guide is available now.
It is separated from this html design guide. 页面 标尺线的立体感和色彩设置 字体 HTML2.0 字符实体名称列表 HTML3.2 字符实体名称列表 文字布局 空白 多列文本 表格 表格在页面中的对齐/布局 多窗口页面 外观 边框色彩 Floating Frame
 Netscape 和 MSIE 的新增支持 MSIE 开始支持 <a href="URL" target="Window_Name"> Netscape 开始支持 <font face="#, #, ..., #"> MSIE 开始支持 <div align=left> ... </div> Netscape 开始支持 <table bgcolor=#> Table Group 改称 Structured Table. Netscape 开始支持 <frame frameborder=#>   asp.net教程]]>