HTML

HyperText Markup Language-- 超文本标记语言, 它是一个SGML DTD

HTML 是一套独立于平台的格式定义( 用标记说明 ) , 用来描述World Wide Web 文档中的各个组成部分. HTML 是Tim Berners-Lee 在 CERN (在日内瓦的欧洲粒子物理实验室) 发明的.

标记说明

一个元素 element 是一个文档结构的基本组成部分. 元素的例子有头 heads, 表格tables, 段落 paragraphs, 列表 lists 等. 你可以这样理解: 你用 HTML 标记为浏览器标出文件的各个元素 . 元素中可以包含普通文本，其他元素，或二者都有.

在 HTML 文档中使用tags表示各种元素. HTML 标记由一个左尖括号 (<), 一个标记名, 和一个右尖括号 (>) 组成. 标记通常成对出现。只是在括号中的标记名中以斜杠 (/) 领头. HTML 标记在下文中列出.

注意: HTML 不区分大小写.

 一 、HTML 标记
   HTML该元素指明你的文件包含 HTML-编码 信息. 文件扩展名 .HTML 也指明该文件是一个 HTML 文档而且 必须使用. (如果你的系统受 8.3 制文件名的限制 (如., LeeHome.htm）, 可以用 .htm 做扩展名.)

1、HEAD
头元素 head 是你的 HTML-编码 文档中包含标题 title 的第一部分.

TITLE
标题 title 元素含有你的文档标题并且作为一种全局上下文识别其内容. 标题通常显示在浏览器窗口的某个位置 (通常在顶端), 而不是在文本区.

2、BODY
HTML文档的第二部分，也是最大的部分是正文 body, 它含有你的文档的内容 (显示在你的浏览器窗口文本区的部分). 下面介绍的标记用在 HTML 文档的正文 body 内.

3、标题字体Headings
HTML 有六级标题字体, 从 1 到 6 编号, 1 号最小. 标题字体的显示比普通文本字体大或者粗. 每个文档中的第一个标题字体应该标记为 <H1>.

标题字体元素的语法为:
<Hy>标题字体文本 </Hy>
其中 y 是从 1 到 6 的数字，指明标题字体的等级.

在你的文档中不要跳跃使用标题字体等级. 例如, 不要用一级标题 (<H1>) 开始，然后跟随一个三级标题 (<H3>) .

4、段落Paragraphs
不同于多数字处理器中的文档, HTML文件中的换行是不重要的. 你不用担心你的文本中行的长度 ( 当然最好不要超过 72 个字符). 在你的源文件中任何地方可以使用换行, 多个空白在你的浏览器中被重叠成为一个空白.

在“最小的 HTML 文档”中给出的例子中第一段的编码为

<P>Welcome to the world of HTML.
This is the first paragraph.
While short it is
still a paragraph!</P>

源文件中各行之间有换行. Web 浏览器忽略这些换行，只有遇到另一个
标记时才开始新段落

 

要点: 你必须用元素指明段落. 浏览器忽略源文件中的任何缩进或空行. 如果没有元素, 文档将被看作一个大段落处理. (一个例外的情况是把文本标记为 "preformatted," 下文中将做介绍.) 例如, 下面的内容的输出和第一个

HTML 例子完全相同:

<H1>Level-one heading</H1> <P>Welcome to the world of HTML. This is the
first paragraph. While short it is still a
paragraph! </P> <P>And this is the second paragraph.</P>

为了保持 HTML文件的可读性, 标题字体应该独占一行, 在开始一个新的部分之前加一到两行空行，段落之间也用空行隔开( 除了用
标记以外). 这些额外的空白在你编辑文件时将会有用 ( 但是你的浏览器将忽略这些空白因为它有自己的关于空白的规则，不依赖于你源文件中的空白).


注意: 结束标记

可以省略. 这是因为当浏览器遇到一个
标记时, 它认为前一个段落到此结束.


使用 <P> 和 </P> 作为段落标记使得你可以通过在源文件中使用 ALIGN=alignment 属性使一个段落居中排列.

<P ALIGN=CENTER>
这是一个居中的段落. [见下面的输出形式]
</P>

这是一个居中的段落.


5、列表Lists:

<UL>
<LI> apples
<LI> bananas
<LI> grapefruit
</UL>

输出形式为:

apples
bananas
grapefruit
<LI> 项可以含有多个段落.


编号列表Numbered Lists

编号列表 (也称为 有序列表ordered list) 和不编号列表相同, 只是用 <OL> 代替 <UL>. 各项同样用 <LI> 标记. 下面的 HTML 代码:

<OL>
<LI> oranges
<LI> peaches
<LI> grapes
</OL>


6、标记 (表示 "preformatted") 可以产生固定宽度的字体. 该标记同时使空格，新行，和制表键 tabs 有效 (多个空格显示为多个空格, 源文件中的换行也在浏览器中产生换行). 这对于程序清单和其他一些情况是很有用的. 例如, 下面的行:
<PRE>
#!/bin/csh
cd $SCR
cfs get mysrc.f:mycfsdir/mysrc.f
cfs get myinfile:mycfsdir/myinfile
fc -02 -o mya.out mysrc.f
mya.out
cfs save myoutfile:mycfsdir/myoutfile
rm *
</PRE>

显示为:

#!/bin/csh
cd $SCR
cfs get mysrc.f:mycfsdir/mysrc.f
cfs get myinfile:mycfsdir/myinfile
fc -02 -o mya.out mysrc.f
mya.out
cfs save myoutfile:mycfsdir/myoutfile
rm *


7、水平线Horizontal Rules
<HR> 标记产生一个和浏览器窗口等宽的水平线. 水平线对于你分割文档中的各个部分很有用. 例如，很多人在他们的文本结束和 <address> 信息开始之前加一个水平线.

你可以改变一条线的尺寸 (粗) 和宽度 ( 水平线延伸长度占窗口的百分比). 你可以试着改变设置，直到对显示效果满意. 例如:

<HR SIZE=4 WIDTH="50%">

 


8、逻辑风格Logical Styles

<SAMP>
用于字母序列. 用固定宽度字体显示. (Segmentation fault: Core dumped.)
<STRONG>
用于着重强调. 通常用粗体显示. (NOTE: Always check your links.)
<VAR>
用于变量, 你将用确定的信息代替这个变量. 通常用斜体显示. (rm filename deletes the file.)
物理风格标记
<B>
粗体文本
<I>
斜体文本
<TT>
打字机文本typewriter text, 如固定宽度文本.


9、链接 Linking
HTML 的主要长处在于它能够链接文本和/或图象到另一个文档或者文档的一部分中. 浏览器用颜色和/或下划线突出指定的文本或图象，以说明它是一个超文本链接hypertext link (通常简写为 hyperlink 或 link).

HTML 的单个与超文本链接有关的标记为 <A>, 表示 anchor. 在文档中包含 anchor:

用 <A 开始一个 anchor ( A 后面要留一个空白)
指明你要连接的文档：HREF="../../filename" ，后面个跟一个右尖括号 (>)
输入在当前文档中作为超链文本的部分
输入 anchor 结束标记: </A> ( anchor 结束标记之前不需空白 )
以下是一个含有超文本链接到 US.HTML: 的例子

<A HREF="MaineStats.HTML">Maine</A>


10、嵌入行中的图象

<IMG SRC=../../SelfPortrait.gif HEIGHT=100 WIDTH=65>

图象定位<IMG SRC = "BarHotlist.gif" ALIGN=TOP>

11、背景图象


包含背景图象的标记包含在 <BODY> 标记描述中作为一个属性:

<BODY BACKGROUND="filename.gif">

背景颜色

<BODY BGCOLOR="#000000" TEXT="#FFFFFF" LINK="#9690CC">

将创建一个窗口，背景为黑色 (BGCOLOR), 文本为白色 (TEXT), 超链为银色 (LINK).


11、ColorPro Web server

外部图象，声音，和动画
你可能希望当用户激活你的文档中一个单词或小的图象作成的链接时，把一幅图象作为单独的文档打开. 这种情况称为一个外部图象, 当你不想由于大的图象而降低主文档的下载速度时，它是很有用的.

要包含一个外部图象的链接, 输入:

<A HREF="MyImage.gif">link anchor</A>

你也可以用一个小的图象作为到大图象的链接. 输入:

<A HREF="LargerImage.gif"><IMG SRC="SmallImage.gif"></A>
ALT="" HEIGHT=48 WIDTH=50>

读者看到图象 SmallImage.gif ，点击它就可以打开文件 LargerImage.gif .

使用同样的语法链接外部动画和声音. 唯一的不同在于链接文件的扩展名. 例如,

<A HREF="AdamsRib.mov">link anchor</A>


12、表格Tables
一个表格的通用格式形式为:

<TABLE> <== 表格定义的开始
caption 内容 <== caption 定义

<TR> <== 第一行定义的开始
单元cell 内容 <== 第一行的第一个单元 (一个头head)
单元内容 <== 第一行最后一个单元(一个头 head)
</TR> <== 第一行定义的结尾
<TR> <== 第二行定义的开始
单元内容 <== 第二行第一个单元
....
单元内容 <== 第二行最后一个单元
</TR> <== 第二行定义的结尾
<TR> <== 最后一行定义的开始
单元内容 <== 最后一行第一个单元
...
单元内容 <== 最后一行最后一个单元
</TR> <== 最后一行定义结尾
</TABLE> <== 表格定义结束
<TABLE> 和 </TABLE> 标记必须把整个表格括起. 表格中的第一个项是 CAPTION, 它是可选部分. 然后你可以用 <TR> 和 </TR> 标记定义任意多行. 在一行内也可以有用<TD>...</TD> 或 <TH>...</TH> 标记定义的任意数目的单元. 表格中的每一行在本质上是和它的上下行独立编排格式的. 这使得你可以很容易地显示象上文中的只有一个单元的表格, 例如表格属性, 跨越表格中的多个列.