HTML高级教程
HTML 高级教程
· HTML 布局
· HTML 框架
· HTML 字体
· HTML 4.0
· HTML CSS
· HTML 实体
· HTML 头部
· HTML 元信息
· HTML URL
· HTML 脚本
· HTML 属性
· HTML 事件
· HTML URL 编码
· HTML 网页服务器
· HTML 摘要
HTML 布局
· Previous Page
· Next Page
在网络上,随处都可以看到像报纸那样的格式化分栏。
HTML布局 - 使用表格
One very common practice with HTML, is to use HTML tables to format the layout of an HTML page. A part of this page is formatted with two columns, like a newspaper page. As you can see on this page, there is a left column and a right column. This text is displayed in the left column. |
An HTML <table> is used to divide a part of this Web page into two columns. The trick is to use a table without borders, and maybe a little extra cell-padding. No matter how much text you add to this page, it will stay inside its column borders. |
同样的布局 - 添加了颜色
One very common practice with HTML, is to use HTML tables to format the layout of an HTML page. A part of this page is formatted with two columns, like a newspaper page. As you can see at this page, there is a left column and a right column. |
An HTML <table> is used to divide a part of this Web page into two columns. This text is displayed in the right column. The trick is to use a table without borders, and maybe a little extra cell-padding. No matter how much text you add to this page, it will stay inside its column borders. |
实例
将HTML页面的一部分分割为表格的列是很容易的。为了您可以亲自尝试它,我们为您准备了这个简单的例子。
HTML 框架
· Previous Page
· Next Page
通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面。
实例
垂直框架
本例演示:如何使用三份不同的文档制作一个垂直框架。
水平框架
本例演示:如何使用三份不同的文档制作一个水平框架。
(可以在本页底端找到更多实例。)
框架
通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面。每份HTML文档称为一个框架,并且每个框架都独立于其他的框架。
使用框架的坏处:
· 开发人员必须同时跟踪更多的HTML文档
· 很难打印整张页面
框架结构标签(<frameset>)
· 框架结构标签(<frameset>)定义如何将窗口分割为框架
· 每个 frameset 定义了一系列行或列
· rows/columns 的值规定了每行或每列占据屏幕的面积
编者注:frameset 标签也被某些文章和书籍译为框架集。
框架标签(Frame)
Frame 标签定义了放置在每个框架中的 HTML 文档。
在下面的这个例子中,我们设置了一个两列的框架集。第一列被设置为占据浏览器窗口的 25%。第二列被设置为占据浏览器窗口的 75%。HTML 文档 "frame_a.htm" 被置于第一个列中,而 HTML 文档 "frame_b.htm" 被置于第二个列中:
<frameset cols="25%,75%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
</frameset>
基本的注意事项 - 有用的提示:
假如一个框架有可见边框,用户可以拖动边框来改变它的大小。为了避免这种情况发生,可以在 <frame> 标签中加入:noresize="noresize"。
为不支持框架的浏览器添加 <noframes> 标签。
重要提示:不能将 <body></body> 标签与 <frameset></frameset> 标签同时使用!不过,假如你添加包含一段文本的 <noframes> 标签,就必须将这段文字嵌套于 <body></body> 标签内。(在下面的第一个实例中,可以查看它是如何实现的。)
更多实例
如何使用 <noframes> 标签
本例演示:如何使用 <noframes> 标签。
混合框架结构
本例演示如何制作含有三份文档的框架结构,同时将他们混合置于行和列之中。
含有 noresize="noresize" 属性的框架结构
本例演示 noresize 属性。在本例中,框架是不可调整尺寸的。在框架间的边框上拖动鼠标,你会发现边框是无法移动的。
导航框架
本例演示如何制作导航框架。导航框架包含一个将第二个框架作为目标的链接列表。名为 "contents.htm" 的文件包含三个链接。
内联框架
本例演示如何创建内联框架(HTML 页中的框架)。
跳转至框架内的一个指定的节
本例演示两个框架。其中的一个框架设置了指向另一个文件内指定的节的链接。这个"link.htm"文件内指定的节使用 <a name="C10"> 进行标识。
使用框架导航跳转至指定的节
本例演示两个框架。左侧的导航框架包含了一个链接列表,这些链接将第二个框架作为目标。第二个框架显示被链接的文档。导航框架其中的链接指向目标文件中指定的节。
HTML 字体
· Previous Page
· Next Page
在 HTML 中,字体标签是不被支持的。一般都认为,在今后版本的 HTML 中,这个标签会被清除出去。
即使很多人都在用它,我们都应该尽量避免它,而使用样式取而代之。
字体标签font
使用类似下面的HTML代码,你可以定义浏览器输出的尺寸和类型:
<p>
<font size="2" face="Verdana">
This is a paragraph.
</font>
</p>
<p>
<font size="3" face="Times">
This is another paragraph.
</font>
</p>
TIY
字体属性
属性 |
例子 |
作用 |
size="number" |
size="2" |
定义字体大小。 |
size="+number" |
size="+1" |
增加字体的大小。 |
size="-number" |
size="-1" |
减少字体的大小。 |
face="face-name" |
face="Times" |
定义字体名称。 |
color="color-value" |
color="#eeff00" |
定义字体颜色。 |
color="color-name" |
color="red" |
定义字体颜色。 |
请不要使用字体标签
在最新的 HTML 版本(HTML 4 和 XHTML)中,字体标签已被废弃。
万维网联盟已从其标准中删除了字体标签,在未来,样式表(CSS)将用来定义布局,以及显示 HTML 元素的属性。
正确的方法 - 使用样式
设置文字的字体
本例演示如何设置文字的字体。
设置文字的尺寸
本例演示如何设置文字的尺寸。
设置文字的颜色
本例演示如何设置文字的颜色。
设置文字的字体、字体尺寸、字体颜色
本例演示如何设置文字的字体、字体尺寸、字体颜色.
在何处可以学习到样式表?
马上开始:把本教程完整地学习完毕!!!在随后的章节,我们将解释为什么类似 <font> 这样的标签会从标准中删除,以及如何在 HTML 文档中插入样式表。
学习更多关于样式表的知识:学习我们的 CSS 教程。
为什么使用 HTML4.0?
· Previous Page
· Next Page
HTML 3.2 真的是特别糟糕!
最初的 HTML 绝没有打算要包含支持格式化文档的标签。HTML 标签原打算用于定义文档的的内容。
<p>This is a paragraph</p>
<h1>This is a heading</h1>
当诸如 <font> 这样的标签和 color 属性被加入 HTML3.2 的规范当中,它开始成为开发者的一场噩梦。那些不得不将字体和文字信息添加到每个单一网页的站点,其开发过程最终变成了漫长、昂贵和极其痛苦的过程。
HTML4.0 的优秀特性
通过使用 HTML4.0,所有的格式化信息都可以从 HTML 文件中剥离,并植入一个独立的样式表。
因为 HTML4.0 将文档的表现与其结构分离,我们从而得到了我们一直需要的东西:在不把文档内容搞糟的情况下,对表现层进行完全的控制。
我们应该做些什么?
停止在 HTML 标签内部使用表现样式属性。
我们的完整的 HTML 标签参考手册对 HTML4.0 标签和属性进行了简要的说明。
请同时参阅我们的 CSS 教程,开始您崭新的开发生涯吧。
为 XHTML 做好准备
XHTML 是新的 HTML。你现在就应该为此做好准备。而您可以做的最重要的事情就是开始编写正确的 HTML4.01 代码。并且使用小写字母编写标签。记得关闭标签。决不要在没有 </p> 标签的情况下结束一个段落。
提示:官方的 HTML4.01 标准推荐使用小写的标签。
如果您希望学习如何将站点升级至 XHTML,请阅读我们的 XHTML 教程。
验证 HTML文件
HTML 文档是根据文档类型声明进行验证的。如果希望 HTML 文件被正确地验证,就要将恰当的 DTD 添加到文件的第一行。
HTML 4.01 Strict DTD 包含没有被反对使用或者不出现在框架中的元素和属性:
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional DTD 包含 strict DTD 中所有的内容,外加被反对使用的元素和属性:
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset DTD 包含 transitional DTD 中所有的内容,外加对框架的支持:
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
通过 W3C 的验证器来测试您的网页:
在下面的文本框中输入您的网址:(比如 http://www.w3school.com.cn/)
窗体顶端
窗体底端
HTML CSS
· Previous Page
· Next Page
通过使用 HTML4.0,所有的格式化代码均可移出 HTML 文档,然后移入一个独立的样式表。
实例
HTML中的样式
本例演示如何使用添加到 <head> 部分的样式信息对 HTML 进行格式化。
没有下划线的链接
本例演示如何使用样式属性做一个没有下划线的链接。
链接到一个外部样式表
本例演示如何 <link> 标签链接到一个外部样式表。
如何使用样式
当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化。有以下三种方式来插入样式表:
外部样式表
当样式需要被应用到很多页面的时候,外部样式表将是理想的选择。使用外部样式表,你就可以通过更改一个文件来改变整个站点的外观。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
内部样式表
当单个文件需要特别样式时,就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
内联样式
当特殊的样式需要应用到个别元素时,就可以使用内联样式。使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
访问我们的 CSS 教程,学习更多有关样式的知识。
标签 |
描述 |
<style> |
定义样式定义。 |
<link> |
定义资源引用。 |
<div> |
定义文档中的节或区域(块级)。 |
<span> |
定义文档中的行内的小块或区域。 |
<font> |
规定文本的字体、字体尺寸、字体颜色。不赞成使用。请使用样式。 |
<basefont> |
定义基准字体。不赞成使用。请使用样式。 |
<center> |
对文本进行水平居中。不赞成使用。请使用样式。 |
HTML 字符实体
· Previous Page
· Next Page
诸如 “<” 之类的符号在HTML中拥有特殊的含义,所以在文本中使用它们。
为了在 HTML 中显示小于号 (<),我们需要使用字符实体。
字符实体
一些字符在 HTML 中拥有特殊的含义,比如小于号 (<) 用于定义 HTML 标签的开始。如果我们希望浏览器正确地显示这些字符,我们必须在 HTML 源码中插入字符实体。
字符实体有三部分:一个和号 (&),一个实体名称,或者 # 和一个实体编号,以及一个分号 (;)。
要在 HTML 文档中显示小于号,我们需要这样写:< 或者 <
使用实体名称而不是实体编号的好处在于,名称相对来说更容易记忆。而这么做的坏处是,并不是所有的浏览器都支持最新的实体名称,然而几乎所有的浏览器对实体编号的支持都很好。
注意:实体对大小写敏感。
亲手实验一下字符实体。(仅支持IE)
空格
空格是 HTML 中最普通的字符实体。
通常情况下,HTML 会裁掉文档中的空格。假如你在文档中连续输入 10 个空格,那么 HTML 会去掉其中的9个。如果使用 ,就可以在文档中增加空格。
最常用的字符实体
显示结果 |
描述 |
实体名称 |
实体编号 |
|
空格 |
|
  |
< |
小于号 |
< |
< |
> |
大于号 |
> |
> |
& |
和号 |
& |
& |
" |
引号 |
" |
" |
' |
撇号 |
' (IE不支持) |
' |
其他一些常用的字符实体
显示结果 |
描述 |
实体名称 |
实体编号 |
¢ |
分 |
¢ |
¢ |
£ |
镑 |
£ |
£ |
¥ |
日圆 |
¥ |
¥ |
§ |
节 |
§ |
§ |
© |
版权 |
© |
© |
® |
注册商标 |
® |
® |
× |
乘号 |
× |
× |
÷ |
除号 |
÷ |
÷ |
HTML 头部
· Previous Page
· Next Page
实例
文档的标题
头元素内部的标题信息不会显示在浏览器窗口中。
一个 target,所有的链接
本例显示如何使用 base 标签使页面中的所有标签在新窗口中打开。
头元素
头元素包含关于文档的概要信息,也称为元信息(meta-information)。Meta 意为“关于某方面的信息”。
可以这么说,元数据(meta-data)是关于数据的信息,而元信息是关于信息的信息。
头元素内的信息
头元素内的元素不会被浏览器显示出来。
根据 HTML 标准,仅有几个标签在 HTML 的头部分是合法的。它们是:<base>, <link>, <meta>, <title>, <style> 和 <script>。
这是一个不合法的结构:
<head>
<p>This is some text</p>
</head>
在这个案例中,浏览器有两种选择:
· 显示文本,因为它在段落元素中。
· 隐藏文本,因为它在头元素中。
假如你将 <h1> 或者 <p> 之类的 HTML 元素像这样置于头元素之中,大多数浏览器都会显示它,即使这是非法的。
浏览器真的应该忽略这个的错误吗?我们不这么认为。即使别人这么认为。
Head 标签
标签 |
描述 |
<head> |
定义关于文档的信息。 |
<title> |
定义文档标题。 |
<base> |
定义页面中所有链接的基准 URL。 |
<link> |
定义资源引用。 |
<meta> |
定义元信息。 |
标签 |
描述 |
<!DOCTYPE> |
定义文档类型。此标签须位于 html 标签之前。 |
HTML 元信息
· Previous Page
· Next Page
实例
文档描述
Meta 元素中的信息可以描述 HTML 文档。
文档关键字
Meta 元素中的信息可以描述文档的关键词。
重定向
这个例子演示:在网址已经变更的情况下,将用户重定向到另外一个地址。
Meta元素
正如在上一章中我们所解释的,头元素包含着关于文档的概要信息。
HTML 同样包含位于 head 元素内部的 meta 元素。Meta 元素的作用是提供文档的元信息。
大多数情况下,meta 元素用来提供与浏览器或者搜索引擎相关的信息,比方说描述文档的内容等等。
提示:W3C 声明说:某些用户程序支持使用 META 在设定好的几秒钟后来刷新当前的页面,并将之替换为另一个 url。开发人员不应使用此技术强迫用户转到不同的页面,因为这样会使页面的可用性变差。相反,应使用服务器端重定向来进行自动页面定向。
参阅:http://www.w3.org/TR/html4/struct/global.html#adef-http-equiv。
针对搜索引擎的关键字
某些万维网搜索引擎使用 meta 标签的 name 和 content 属性来索引页面。
这个 Meta 元素定义了对页面的描述:
<meta name="description"
content="Free Web tutorials on HTML, CSS, XML, and XHTML" />
这个 Meta 元素定义了页面的关键字:
<meta name="keywords"
content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript">
name 和 content 属性的作用是描述页面的内容。
然而,由于非常多的网管们使用 meta 标签制造垃圾信息,比方说在页面重复关键词以达到提高排名的目的,一些搜索引擎已经彻底放弃了使用它们。
请阅读我们的 网站构建教程,学习更多关于搜索引擎的知识。
陌生的Meta属性
有时你会发现一些对你来说很陌生的 meta 属性,比方说:
<meta name="security" content="low">。
其实你只需明白,这些东西对于站点或者开发人员来说具有某种特殊的意义,而也许对你来说没有什么关系。
你也可以在我们的完整的 HTML4.01 标签参考手册 中找到更多有关 meta 标签 的信息。
HTML URL(统一资源定位器)
· Previous Page
· Next Page
HTML链接
当你单击 HTML 文档中的某个链接时,就像这个:最后一页,其中的 <a> 标签就会使用类似这样的 href 属性值指向一个网络上的地址:<a href="lastpage.htm">Last Page</a>
在这个例子中,Last Page 的链接地址是相对于你所浏览的网站而言的,你的浏览器会自动构建一个完整的网址来访问这个页面,比如 http://www.w3school.com.cn/html/lastpage.html。
URL(统一资源定位器)
一个称为 URL(统一资源定位器)的东西用于对万维网上的文档(或其他数据)进行寻址。一个完整的网址,例如:http://www.w3school.com.cn/html/lastpage.html,遵守如下语法规则:
scheme://host.domain:port/path/filename
Scheme 定义因特网服务的类型。最流行的类型是 http。
domain(域)定义因特网域名,比如:w3school.com.cn。
host(主机)定义此域中的主机。如果被省略,缺省的支持 http 的主机是 www。
:port(端口)定义主机的端口号。端口号通常是被省略的。缺省的端口号是 80。
path(路径)定义服务器上的路径(一个辅助的路径)。如果路径被省略,资源(文档)会被定位到网站的根目录。
filename(文件名)定义文档的名称。缺省的文件名一般会是 default.asp 或者 index.html,或者依据 WEB 服务器设置的其他文件名。
编者注:URL 的英文全称是 Uniform Resource Locator,中文也译为“统一资源定位符”。
URL Schemes
以下是其中一些最流行的 scheme:
Schemes |
访问 |
file |
本地 PC 上的文件。 |
ftp |
FTP 服务器上的文件。 |
http |
World Wide Web 服务器上的文件。 |
gopher |
Gopher 服务器上的文件。 |
news |
Usenet 新闻组。 |
telnet |
Telnet 连接。 |
WAIS |
WAIS 服务器上的文件。 |
访问新闻组
以下 HTML 代码创建一个指向新闻组的链接:
<a href="news:alt.html">HTML Newsgroup</a>
这个链接显示如下:HTML Newsgroup
使用 FTP 进行下载
以下 HTML 代码创建一个下载文件的链接:
<a href="ftp://www.w3school.com.cn/ftp/winzip.exe">Download WinZip</a>
这个链接显示如下:Download WinZip
(这个链接是无法工作的,它仅仅是个例子,所以无需尝试。我们没有提供 FTP 目录。)
链接到邮件系统
以下 HTML 代码创建一个指向您的邮件系统的链接:
<a href="mailto:[email protected]">[email protected]</a>
这个链接显示如下:[email protected]
HTML 脚本
· Previous Page
· Next Page
向 HTML 添加脚本(Script),使其动态性和交互性更强。
实例
插入一段脚本
本例演示如何将脚本插入 HTML 文档。
运行于不支持脚本的浏览器
本例演示如何对付不支持脚本的浏览器。
将脚本插入 HTML 页
HTML 中的脚本使用 <script> 标签进行定义。请注意你可以使用 type 属性来指定脚本语言。
<html>
<head>
</head>
<body>
<script type="text/javascript">
document.write("Hello World!")
</script>
</body>
</html>
上面的脚本输出以下结果:
Hello World!
提示:如果需要学习更多有关在 HTML 中编写脚本的知识,请访问我们的《JavaScript 教程》
如何应付老式的浏览器
如果浏览器压根没法识别 <script> 标签,那么 <script> 标签所包含的内容将以文本方式显示在页面上。为了避免这种情况发生,你应该将脚本隐藏在注释标签当中。那些老的浏览器(无法识别 <script> 标签的浏览器)将忽略这些注释,所以不会将标签的内容显示到页面上。而那些新的浏览器将读懂这些脚本并执行它们,即使代码被嵌套在注释标签内。
实例
JavaScript:
<script type="text/javascript">
<!--
document.write("Hello World!")
//-->
</script>
VBScript:
<script type="text/vbscript">
<!--
document.write("Hello World!")
'-->
</script>
<noscript> 标签
除了将脚本隐藏于注释中,你还可以添加 <noscript> 标签。<noscript> 标签用于定义假如脚本没有执行时的替代文本。这个标签被用于以下情况:如果浏览器能够识别 <script> 标签,但是不支持其中的脚本,那么这些浏览器将显示出 <noscript> 标签内部的文本。不过,如果浏览器支持 <script> 内的脚本,那么浏览器将忽略 <noscript> 标签。
JavaScript:
<script type="text/javascript">
<!--
document.write("Hello World!")
//-->
</script>
<noscript>Your browser does not support JavaScript!</noscript>
VBScript:
<script type="text/vbscript">
<!--
document.write("Hello World!")
'-->
</script>
<noscript>Your browser does not support VBScript!</noscript>
标签 |
描述 |
<script> |
定义脚本。 |
<noscript> |
定义在脚本无法执行的情况下的替代文本。 |
<object> |
定义嵌入的对象。 |
<param> |
为对象定义 run-time 设置(参数)。 |
<applet> |
不赞成使用。请使用 <object>。 |
HTML 4.0 标准属性
· Previous Page
· Next Page
HTML 标签可拥有属性。
这里列出的属性是通用于每个标签的核心属性和语言属性(有个别例外)。
我们在 HTML 4.01 / XHTML 1.0 参考手册 中提供了各标签特殊属性的详细信息。
核心属性 (Core Attributes)
以下标签不提供下面的属性:base、head、html、meta、param、script、style 以及 title 元素。
属性 |
值 |
描述 |
class |
classname |
规定元素的类名(classname) |
id |
id |
规定元素的唯一 id |
style |
style_definition |
规定元素的行内样式(inline style) |
title |
text |
规定元素的额外信息(可在工具提示中显示) |
语言属性 (Language Attributes)
以下标签不提供下面的属性:base、br、frame、frameset、hr、iframe、param 以及 script 元素。
属性 |
值 |
描述 |
dir |
ltr | rtl |
设置元素中内容的文本方向。 |
lang |
language_code |
设置元素中内容的语言代码。语言代码参考 |
xml:lang |
language_code |
设置 XHTML 文档中元素内容的语言代码。语言代码参考 |
键盘属性 (Keyboard Attributes)
属性 |
值 |
描述 |
accesskey |
character |
设置访问元素的键盘快捷键。 |
tabindex |
number |
设置元素的 Tab 键控制次序。 |
HTML 4.0 事件属性
· Previous Page
· Next Page
HTML 4 的新特性之一是可以使 HTML 事件触发浏览器中的行为,比方说当用户点击某个 HTML 元素时启动一段 JavaScript。
在现代浏览器中都内置有大量的事件处理器。这些处理器会监视特定的条件或用户行为,例如鼠标单击或浏览器窗口中完成加载某个图像。通过使用客户端的 JavaScript,可以将某些特定的事件处理器作为属性添加给特定的标签,并可以在事件发生时执行一个或多个 JavaScript 命令或函数。
事件处理器的值是一个或一系列以分号隔开的 Javascript 表达式、方法和函数调用,并用引号引起来。当事件发生时,浏览器会执行这些代码。例如,当您把鼠标移动到一个超链接时,会启动一个 JavaScript 函数。支持 JavaScript 的浏览器支持 <a> 标签中的一个特殊的 "mouse over"事件处理器 - 被称为 onmouseover 来完成这项工作:
<a href="/index.html" onmouseover="alert('Welcome');return false"></a>
如需学习更多有关事件编程方面的知识,请访问 W3School 提供的 JavaScript 教程 和 DHTML 教程。
下面的表格提供了标准的事件属性,可以把它们插入 HTML/XHTML 元素中,以定义事件行为。
窗口事件 (Window Events)
仅在 body 和 frameset 元素中有效。
属性 |
值 |
描述 |
onload |
脚本 |
当文档载入时执行脚本 |
onunload |
脚本 |
当文档卸载时执行脚本 |
表单元素事件 (Form Element Events)
仅在表单元素中有效。
属性 |
值 |
描述 |
onchange |
脚本 |
当元素改变时执行脚本 |
onsubmit |
脚本 |
当表单被提交时执行脚本 |
onreset |
脚本 |
当表单被重置时执行脚本 |
onselect |
脚本 |
当元素被选取时执行脚本 |
onblur |
脚本 |
当元素失去焦点时执行脚本 |
onfocus |
脚本 |
当元素获得焦点时执行脚本 |
图像事件 (Image Events)
该属性可用于 img 元素:
属性 |
值 |
描述 |
onabort |
脚本 |
当图像加载中断时执行脚本 |
键盘事件 (Keyboard Events)
在下列元素中无效:base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, 以及 title 元素。
属性 |
值 |
描述 |
onkeydown |
脚本 |
当键盘被按下时执行脚本 |
onkeypress |
脚本 |
当键盘被按下后又松开时执行脚本 |
onkeyup |
脚本 |
当键盘被松开时执行脚本 |
鼠标事件 (Mouse Events)
在下列元素中无效:base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, title 元素。
属性 |
值 |
描述 |
onclick |
脚本 |
当鼠标被单击时执行脚本 |
ondblclick |
脚本 |
当鼠标被双击时执行脚本 |
onmousedown |
脚本 |
当鼠标按钮被按下时执行脚本 |
onmousemove |
脚本 |
当鼠标指针移动时执行脚本 |
onmouseout |
脚本 |
当鼠标指针移出某元素时执行脚本 |
onmouseover |
脚本 |
当鼠标指针悬停于某元素之上时执行脚本 |
onmouseup |
脚本 |
当鼠标按钮被松开时执行脚本 |
HTML URL 编码
· Previous Page
· Next Page
URL 编码的作用是把字符转换为可在因特网上安全传输的格式。
URL - Uniform Resource Locator(统一资源定位符)
Web 浏览器通过使用 URL 从 web 服务器上请求页面。
URL 是网页的地址,比如:www.w3school.com.cn。
URL 编码
在因特网上传送 URL 的话,只能使用 ASCII 字符集。
由于 URL 经常会包含 ASCII 字符集以外的字符,所以必须对 URL 进行转换。URL 编码所做的事情就是把 URL 转换为有效的 ASCII 格式。
在进行 URL 编码时,每一个非安全的 ASCII 字符会被替换为 "%hh" 格式,其中 hh 是两位十六进制数,它对应于该字符在 ISO-8859-1 字符集里的字符编码值。
URL 中不能含有空格,URL 编码通常会将空格替换为加号(+)。
参考手册
如需完整的 URL 编码参考,请访问我们的 URL 编码参考手册。
准备好发布你的作品了吗?
· Previous Page
· Next Page
第一步:个人 WEB 服务器(PWS)
· 如果你希望其他人访问你的页面,就必须发布它们。
· 要发布你的作品,你就要将你的文件拷贝到 WEB 服务器。
· 你自己的 PC 也可以作为 WEB 服务器使用,不过前提是它必须接入互联网。
· 如果使用的是 Windows 98,你可以用 PWS (Personal Web Server)。
· 你可以在 Windows 的安装 CD 的 PWS 文件夹中找到 PWS。
Personal Web Server (PWS)
PWS 可以将任何视窗计算机改造成 WEB 服务器。PWS 易于安装,同时也是开发和测试 WEB 应用程序的理想平台。PWS 为工作站进行了优化,不过仍然拥有一个完整的 WEB 服务器所有的必备条件。
如何安装 Personal Web Server (PWS):
· 浏览你的 Windows 安装程序,看一下 PWS 已经被安装。
· 如果没有,从 Windows 安装 CD 的 PWS 目录安装 PWS。
· 根据安装提示进行安装,然后启动运行你的 PWS。
如需更多信息,请参阅微软站点:如何安装 Microsoft Personal Web Server。
提示:微软的 Windows XP 家庭版不提供对 PWS 的支持。
Internet Information Server (IIS)
Windows 2000 内置的 WEB 服务器 IIS,使得创建针对网络的大型应用程序变得简单。PWS 和 IIS 均包含 ASP,一种用于创建动态和交互性 WEB 应用程序的服务器端脚本标准。同时,IIS 也可以应用于 Windows NT 平台。
如果希望阅读更多关于 ASP 的内容,请阅读我们的 ASP 教程。
更多关于微软 Internet Information Services 的信息。
下一步: 专业的 Web Server ?
· 假如你不打算使用 PWS 和 IIS,那么你需要将文件上传到一个公共的空间。
· 大多数因特网服务提供商均提供网页寄存服务。
· 如果你的老板有一个因特网的服务器,你也可以要求他为你寄存网页。
· 当然,如果你对此极为认真的话,你应该搭建自己的因特网服务器。
在你选择一个 ISP 之前,一定要阅读我们的《网站主机教程》。
你已经将 HTML 教程学习完毕,下一步该学习什么呢?
· Previous Page
· Next Page
HTML 概要
本教程已教你如何使用 HTML 创建站点。
HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本,添加图片,创建链接、输入表单、框架和表格等等,并可将之存为文本文件,浏览器即可读取和显示。
HTML 的关键是标签,其作用是指示将出现的内容。
如需更多关于 HTML 的信息,请查看我们的 HTML 实例 和 HTML 参考手册 。
现在,你已学完HTML,接下来该学习什么呢?
下一步,你应该学习 XHTML 和 CSS 。
XHTML
XHTML 是新的 HTML 。最新的HTML版本是 HTML 4.01,同时也是最终的版本。
HTML 将被 XHTML 取代,XHTML 是更严格且更纯净的 HTML 版本。
如需学习 XHTML,请访问我们的 XHTML 教程 。
CSS
CSS被用来同时控制多重网页的样式和布局。
通过使用 CSS,所有的格式化均可从 HTML 中剥离处来,并存储于一个独立的文件中。
CSS 给予你对布局的完全控制,同时不会弄乱文档内容。
如需学习如何创建样式表,请访问我们的 CSS 教程 。
选修课:HTML 5
HTML 5 是下一代的 HTML。
HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。
在 W3School 的 HTML 5 教程中,您将了解 HTML5 中的新特性。
现在就开始学习 HTML 5 !