HTML速成教材Word下载.docx
《HTML速成教材Word下载.docx》由会员分享，可在线阅读，更多相关《HTML速成教材Word下载.docx（25页珍藏版）》请在冰豆网上搜索。
）,一个标记名,和一个右尖括号（>
）组成.标记通常成对出现（如,<
H1>
和<
/H1>
）以指出标记作用的范围.结束标记和起始标记相似，只是在括号中的标记名中以斜杠（/）领头.HTML标记在下文中列出.
有些元素可能含有一个属性attribute,它是包含在起始标记中的附加信息说明.例如,通过在图象文件的HTML代码中包含适当的属性，你可以指明一幅图象的位置（顶端,中间,或底部）.具有可选属性的标记如下.
注意:
HTML不区分大小写.<
title>
等价于<
TITLE>
或<
TiTlE>
.有几个例外的情况列在下文中的转义序列中.
并非所有的WorldWideWeb浏览器都支持所有的标记.如果一个浏览器不支持某个标记,它通常只是忽略之.
2.2HTML文档实例
每个HTML文档应该包含一些标准HTML标记.每个文档都包含头head和正文bodytext两部分.头中含有标题title,正文中含有实际构成段落，列表和其他元素的文本.浏览器需要具体的信息是因为它们都是根据HTML和SGML说明编程的.
下面的源文档举例说明必须的元素:
<
html>
head>
ASimpleHTMLExample<
/TITLE>
/head>
body>
HTMLisEasyToLearn<
P>
WelcometotheworldofHTML.
Thisisthefirstparagraph.Whileshortitis
stillaparagraph!
<
/P>
Andthisisthesecondparagraph.<
/body>
/html>
2.3HTML标记解释
HTML
该元素指明你的文件包含HTML-编码信息.文件扩展名.html也指明该文件是一个HTML文档而且必须使用.（如果你的系统受8.3制文件名的限制（如.,LeeHome.htm）,可以用.htm做扩展名.）
HEAD
头元素head是你的HTML-编码文档中包含标题title的第一部分.标题是作为你的浏览器窗口的一部分来显示的（见下文）.
TITLE
标题title元素含有你的文档标题并且作为一种全局上下文识别其内容.标题通常显示在浏览器窗口的某个位置（通常在顶端）,而不是在文本区.标题同时也用于热点列表hotlist或书签列表bookmarklist中的显示,因此标题的选择因当是描述性的,独特的,和相对简洁的.标题在WAIS服务中还用于搜索服务器.
例如,你可能在一章的内容中包含一个短小的书本的标题:
NCSAMosaic指南（Windows）:
安装.这个标题说明了软件的名称,使用平台,和本章内容,它比简单地把该文档称为安装.要好得多。
一般你的标题应该不超过64个字符.
BODY
HTML文档的第二部分，也是最大的部分是正文body,它含有你的文档的内容（显示在你的浏览器窗口文本区的部分）.下面介绍的标记用在HTML文档的正文body内.
标题字体Headings
HTML有六级标题字体,从1到6编号,1号最小.标题字体的显示比普通文本字体大或者粗.每个文档中的第一个标题字体应该标记为<
.
标题字体元素的语法为:
Hy>
标题字体文本<
/Hy>
其中y是从1到6的数字，指明标题字体的等级.
在你的文档中不要跳跃使用标题字体等级.例如,不要用一级标题（<
）开始，然后跟随一个三级标题（<
H3>
）.
段落Paragraphs
不同于多数字处理器中的文档,HTML文件中的换行是不重要的.你不用担心你的文本中行的长度（当然最好不要超过72个字符）.在你的源文件中任何地方可以使用换行,多个空白在你的浏览器中被重叠成为一个空白.
在“最小的HTML文档”中给出的例子中第一段的编码为
Thisisthefirstparagraph.
Whileshortitis
源文件中各行之间有换行.Web浏览器忽略这些换行，只有遇到另一个<
p>
标记时才开始新段落<
要点:
你必须用<
元素指明段落.浏览器忽略源文件中的任何缩进或空行.如果没有<
元素,文档将被看作一个大段落处理.（一个例外的情况是把文本标记为"
preformatted,"
下文中将做介绍.）例如,下面的内容的输出和第一个HTML例子完全相同:
Level-oneheading<
WelcometotheworldofHTML.Thisisthe
firstparagraph.Whileshortitisstilla
paragraph!
为了保持HTML文件的可读性,标题字体应该独占一行,在开始一个新的部分之前加一到两行空行，段落之间也用空行隔开（除了用<
标记以外）.这些额外的空白在你编辑文件时将会有用（但是你的浏览器将忽略这些空白因为它有自己的关于空白的规则，不依赖于你源文件中的空白）.
结束标记<
可以省略.这是因为当浏览器遇到一个<
标记时,它认为前一个段落到此结束.
使用<
作为段落标记使得你可以通过在源文件中使用ALIGN=alignment属性使一个段落居中排列.
PALIGN=CENTER>
这是一个居中的段落.[见下面的输出形式]
这是一个居中的段落.
列表Lists
HTML支持不编号unnumbered,编号numbered,和定义definition三种列表.你也可以嵌套列表,但是不要嵌套过多，否则会使读者感到不清晰。
不编号列表UnnumberedLists
制作一个不编号的，公告式列表,
1.用开始标记<
UL>
（unnumberedlist的简记）开始
2.输入<
LI>
（listitem）标记，后面跟独立的项;
不需使用<
/LI>
标记
3.用<
/UL>
标记结束整个列表
下面是一个有三个项的列表:
apples
bananas
grapefruit
输出形式为:
∙apples
∙bananas
∙grapefruit
项可以含有多个段落.用段落标记<
指明.
编号列表NumberedLists
编号列表（也称为有序列表orderedlist）和不编号列表相同,只是用<
OL>
代替<
.各项同样用<
标记.下面的HTML代码:
oranges
peaches
grapes
/OL>
产生的输出为:
1.oranges
2.peaches
3.grapes
定义列表DefinitionLists
定义列表（编码为<
DL>
）通常含有交替出现的定义术语definitionterm（编码为<
DT>
）和定义描述definitiondefinition（编码为<
DD>
）.Web浏览器通常另起一行显示定义描述.
下面是一个定义列表的例子:
NCSA
NCSA,theNationalCenterforSupercomputingApplications,
islocatedonthecampusoftheUniversityofIllinois
atUrbana-Champaign.
CornellTheoryCenter
CTCislocatedonthecampusofCornellUniversityinIthaca,
NewYork.
/DL>
NCSA
NCSA,theNationalCenterforSupercomputingApplications,islocatedonthecampusoftheUniversityofIllinoisatUrbana-Champaign.
CornellTheoryCenter
CTCislocatedonthecampusofCornellUniversityinIthaca,NewYork.
项可以包含多个段落（用<
标记指示）,列表,或其他的定义信息.
COMPACT属性可能会被经常使用，如果你的定义术语很简短的话.例如，如果你想显示一些计算机选项,它们可以和定义的开始处于同一行中.
DLCOMPACT>
-i
invokesNCSAMosaicforMicrosoftWindowsusingthe
initializationfiledefinedinthepath
-k
invokesNCSAMosaicforMicrosoftWindowsinkioskmode
-i
invokesNCSAMosaicforMicrosoftWindowsusingtheinitializationfiledefinedinthepath.
-k
invokesNCSAMosaicforMicrosoftWindowsinkioskmode.
嵌套列表NestedLists
列表可以嵌套.在每个列表项中，你还可以含有多个段落，每个段落含有嵌套列表.
这里是一个嵌套列表的例子:
AfewNewEnglandstates:
Vermont
NewHampshire
Maine
TwoMidwesternstates:
Michigan
Indiana
这个嵌套列表的显示：
∙AfewNewEnglandstates:
oVermont
oNewHampshire
oMaine
∙TwoMidwesternstates:
oMichigan
oIndiana
预排格式文本PreformattedText
用<
PRE>
标记（表示"
preformatted"
）可以产生固定宽度的字体.该标记同时使空格，新行，和制表键tabs有效（多个空格显示为多个空格,源文件中的换行也在浏览器中产生换行）.这对于程序清单和其他一些情况是很有用的.例如,下面的行:
#!
/bin/csh
cd$SCR
cfsgetmysrc.f:
mycfsdir/mysrc.f
cfsgetmyinfile:
mycfsdir/myinfile
fc-02-omya.outmysrc.f
mya.out
cfssavemyoutfile:
mycfsdir/myoutfile
rm*
/PRE>
显示为:
rm*
标记可以带一个宽度属性WIDTH，指明一行中最多允许的字符数.WIDTH同时通知浏览器选择一个合适的字体以及文本的缩排.
在<
作用的部分中也可以加超链.但是其他的HTML标记应该避免在<
的区间中使用.
注意，由于<
>
和&
在HTML文件中有特殊含义,在你输入这些字符的时候必须使用它们的转义序列（分别为&
lt;
&
gt;
amp;
）.详细内容参见转义序列.
大范围引用ExtendedQuotations
BLOCKQUOTE>
标记可以在屏幕上用分离的块显示大段的引用.多数浏览器通常改变引用部分的页边界，以和周围的文本区分开.
在下面的例子中:
Omitneedlesswords.<
Vigorouswritingisconcise.Asentenceshouldcontainno
unnecessarywords,aparagraphnounnecessarysentences,forthe
samereasonthatadrawingshouldhavenounnecessarylinesanda
machinenounnecessaryparts.<
--WilliamStrunk,Jr.,1918
/BLOCKQUOTE>
显示结果为:
Omitneedlesswords.
Vigorouswritingisconcise.Asentenceshouldcontainnounnecessarywords,aparagraphnounnecessarysentences,forthesamereasonthatadrawingshouldhavenounnecessarylinesandamachinenounnecessaryparts.
--WilliamStrunk,Jr.,1918
地址Addresses
ADDRESS>
标记通常用于说明文档的作者,与作者联系的方法（如,一个电子邮件地址）,和一个修订日期.它一般是一个文件的最后部分.
例如,本在线指南的最后一行为:
ABeginner'
sGuidetoHTML/NCSA/pubs@ncsa.uiuc.edu/revisedApril96
/ADDRESS>
结果为:
ABeginner'
不用于普通邮政地址.关于普通邮政地址参见下文的"
强制换行"
.
强制换行ForcedLineBreaks/邮政地址PostalAddresses
BR>
标记强制产生一个换行，行间没有间隙.对于由较短的行组成的文本，如邮政地址，<
元素产生的附加空行会使你觉得不必要.例如,使用<
:
NationalCenterforSupercomputingApplications<
605EastSpringfieldAvenue<
Champaign,Illinois61820-5518<
输出为:
NationalCenterforSupercomputingApplications
605EastSpringfieldAvenue
Champaign,Illinois61820-5518
水平线HorizontalRules
HR>
标记产生一个和浏览器窗口等宽的水平线.水平线对于你分割文档中的各个部分很有用.例如，很多人在他们的文本结束和<
address>
信息开始之前加一个水平线.
你可以改变一条线的尺寸（粗）和宽度（水平线延伸长度占窗口的百分比）.你可以试着改变设置，直到对显示效果满意.例如:
HRSIZE=4WIDTH="
50%"
>
2.4字符格式
HTML有针对单个字符或句子的两种风格:
逻辑风格和物理风格logicalandphysical.逻辑风格Logicalstyles根据文本的内容进行标记,而物理风格physicalstyles指明一个部分的显示效果.例如,在前面的句子中,"
logicalstyles"
这个单词标记为一个"
定义definition."
同样的效果（斜体）可以通过其他的标记告诉你的浏览器"
把这些字变成斜体"
来实现。
注意：
有些浏览器对<
DFN>
标记不做任何风格解释,因此你可能没有发现前面段落中的单词显示成斜体。
逻辑风格和物理风格LogicalVersusPhysicalStyles
如果物理风格和逻辑风格能够产生相同的效果,为什么不和而为一呢?
在理想的SGML概念中,内容和它的显示是分开的.因此SGML标记一个一级标题字体为一级标题字体,但是并不指明一级标题字体应该显示多大,例如,24点粗体加倍集中24-pointboldTimescentered.这种处理的好处（类似于很多字处理软件的stylesheets）是，如果你决定把一级标记字体改为20-pointleft-justifiedHelvetica,你只需要改变你的浏览器中一级标题字体的定义就可以了.今天确实有很多浏览器允许你按你的希望定义多种HTML标记在屏幕上的实际效果.
逻辑标签的另一个优点在于它们有助于在你的文档中保持一致性.标记<
比24-pointboldTimescenter或其它描述要好记得多.例如,对<
STRONG>
标记.多数浏览器用粗体解释.但是,某个读者可能喜欢把这部分显示为红色.逻辑风格提供了这种灵活性.
当然,假设如果你想用斜体显示一些内容而不想受浏览器的设置的影响,你就需要使用物理风格.因此，物理风格提供一种另一种一致性：
在你的文档中用某种方式显示的内容在别的地方也会以同样的方式显示.
你应该固定地使用某一种风格.如果你用物理风格标记,则在一篇文档中全都使用物理风格.如果你使用逻辑风格,则在文档中坚持使用逻辑风格.记住，将来的HTML可能不再支持物理风格,这意味着浏览器将不解释物理风格的编码.
逻辑风格LogicalStyles
用于被定义的单词.一般用斜体显示.（NCSAMosaicisaWorldWideWebbrowser.）
EM>
用于强调.通常用斜体显示.（Consultantscannotresetyourpasswordunlessyoucallthehelpline.）
CITE>
用于书籍的标题,等.通常斜体显示.（ABeginner'
sGuidetoHTML）
CODE>
用于计算机编码.用固定宽度字体显示.（The<
stdio.h>
headerfile）
KBD>
用于用户键盘输入.通常用无格式固定宽度字体显示.（Enterpasswdtochangeyourpassword.）
SAMP>
用于字母序列.用固定宽度字体显示.（Segmentationfault:
Coredumped.）
用于着重强调.通常用粗体显示.（NOTE:
Alwayscheckyourlinks.）
VAR>
用于变量,你将用确定的信息代替这个变量.通常用斜体显示.（rmfilenamedeletesthefile.）
物理风格标记
B>
粗体文本
I>
斜体文本
TT>
打字机文本typewritertext,如固定宽度文本.
转义序列EscapeSequences（a.k.a.CharacterEntities）
字符有两种功能:
∙转义特殊字符
∙显示普通ASCII
升级会员 