电脑爱好者,提供IT资讯信息及各类编程知识文章介绍,欢迎大家来本站学习电脑知识。 最近更新 | 联系我们 RSS订阅本站最新文章
电脑爱好者
站内搜索: 
当前位置:首页>> HTML>>HTML 初学者指南之四:

HTML 初学者指南之四

来源:远方网络 | 2005-3-16 7:50:06 | (有1841人读过)

不过你只需要制作一个很小的图象. 浏览器会使用一种称之为“盖瓦”tiling的特性重复显示这个图象,填满整个浏览器窗口。简单地说,你只要生成一幅图象,浏览器会自动重复多次,直到填满你的窗口。当你使用下面说明的标记时,这个动作会自动执行.

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

<BODY BACKGROUND="filename.gif">

背景颜色
缺省情况下浏览器使用灰底黑字显示文本. 但是, 你可以改变它们. 一些 HTML 作者选择一个背景颜色,配以文本颜色的相应改变.

对于这种改变一定要预先看一看,是否还易于阅读. (例如, 不少人用黑底红字,非常难以阅读!)

使用<BODY>标记的多种属性,你可以改变文本,链接,看过的链接和活动链接的颜色. 例如, 输入:

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

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

六位的数字和字母的组合代表颜色,它给出某种颜色的 RGB (红red, 绿green, 蓝blue)的值. 这个六位数字实际上是三个顺序排列的两位数, 代表从00到FF的红,绿,蓝比重的十六进制值。例如, 000000 表示黑色(没有任何颜色), FF0000 是亮红, FFFFFF 是白色 (所有三种颜色全部饱和). 这些数字和字母的组合的含义是模糊的. 幸运的是有一个在线资源可以帮助你了解各种组合与颜色的对应关系:

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>



HTML 初学者指南(九)

指明一个到QuickTime 电影的链接. 一些通常的文件类型和其扩展名为:

文件类型 扩展名
纯文本plain text .txt
HTML 文档 .html
GIF 图象 .gif
TIFF 图象 .tiff
X 位图图象 .xbm
JPEG 图象 .jpg 或 .jpeg
PostScript 文件 .ps
AIFF 声音文件 .aiff
AU 声音文件 .au
WAV 声音文件 .wav
QuickTime 电影 .mov
MPEG 电影 .mpeg 或 .mpg

记住你假设的读者和他们使用的软件. 例如,多数UNIX 工作站不能播放QuickTime 电影.

表格Tables
在 HTML 制定表格标记之前, HTML 作者不得不在<PRE> 标记中仔细安排他们的表格式的信息,计算空格的个数,预览输出效果。表格不仅对描述表格式信息十分有用,对于那些经常性的 HTML 作者来说,它可以使他们可以方便地完成大量的 Web 页. (请看 NCSA Relativity Group's pages ,一个很好的例子.)

根据下面的编码解释考虑你的表格式信息. 一个表格得有一些表头,用于说明每行/列包含什么内容,行rows表示信息, 单元cells表示每个项. 在下面的表格中, 第一列包含表头信息, 每行说明一个 HTML 表格标记, 每个单元含有一对标记或者对标记功能的解释.

表格元素
元素 描述
<TABLE> ... </TABLE> 定义一个表格。 如果使用了 BORDER 属性, 浏览器显示一个带边界的表格.
<CAPTION> ... </CAPTION> 定义表格标题的caption . 标题的缺省位置在表格的顶部. 属性 ALIGN=BOTTOM可以用于指定标题显示在表格底部
注:caption标记内可以使用任意其他标记.
<TR> ... </TR> 说明表格中的一行. 你可以定义整个行的缺省属性: ALIGN (LEFT, CENTER, RIGHT) 和/或 VALIGN (TOP, MIDDLE, BOTTOM). 详细内容参考本表格末尾的"表格属性"部分.
<TH> ... </TH> 定义一个表格头单元. 缺省状态该单元的文本为粗体居中. 该单元可以包含其他属性,说明单元属性和/或单元内容. 详细内容参见本表格底部的"表格属性"部分.
<TD> ... </TD> 定义一个表格数据单元. 缺省情况下该单元内的文本为水平方向靠左对齐, 垂直方向居中排放. 该单元可以包含其他属性,说明单元属性和/或单元内容. 详细内容参见本表格底部的"表格属性"部分.
表格属性
注: 在<TH> ... </TH> 或 <TD> ... </TD> 单元中定义的属性将覆盖( override ) <TR> ... </TR>中的缺省定义.
属性 描述
ALIGN (LEFT, CENTER, RIGHT)
VALIGN (TOP, MIDDLE, BOTTOM)
COLSPAN=n
ROWSPAN=n
NOWRAP
一个单元的水平位置分配.
一个单元的垂直位置分配.
一个单元跨多少列(n).
一个单元跨多少行(n).
关闭一个单元中的自动换行(word wrapping).


通用表格格式
一个表格的通用格式形式为:

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

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

非表格式信息使用的表格
有些 HTML 作者使用表格描述非表格化信息. 例如, 因为链接可以包含在表格单元中, 一些作者使用没有边界的表格组合一些分离的图象创建“一个”图象. 可以显示表格的浏览器可以无缝隙地显示这些实际分离的图象, 使得合成的图象类似于一个 图象映象image map (一个带有矩形超链区域的图象).

使用带有图象边界的表格也可以得到很好的显示效果. 不妨试一试,看看自己喜欢哪种风格.

填充 Form (Fill-out Forms)
Web form 使读者可以向 Web 服务器返回信息以产生某种动作. 例如, 假设你想收集名字和电子邮件地址以便向提出要求的读者发送电子邮件. 对每个输入他/她的姓名和地址的人, 你需要得到要发送的信息和加到数据库中的响应者的项目.

这种输入数据的处理工作通常是由script(描述式语言:译者注)描述函数或者用 Perl 或其他处理文本,文件和信息的语言编写的程序来完成的. 如果你写不出能够处理输入数据的程序或script函数, 你就得找其他人替你完成.

Form 本身倒是比较简单. 它们也使用 HTML 标记来生成. 可能不同的地方在于接受并处理递交数据的程序或script描述函数. 由于需要说明专门的处理输入信息的script描述函数, 在本指南中不讨论 填充forms.



HTML 初学者指南(十)

疑难解答
避免标记重叠
请看这个 HTML 例子:

<B>This is an example of <DFN>overlapping</B> HTML tags.</DFN>

overlapping 这个单词被同时包含在 <B> 和 <DFN> 两个标记中. 浏览器在这种情况下会无所适从,因而你可能得不到预期的效果.

通常情况下应该避免标记重叠. 检查你的标记,让它们成对出现. 成对使用的标记(显然,结束标记可以省略的元素除外, 如段落标记) 中间不应该被打断. 再看看上面的例子. 在中间的标记(DFN)尚未结束前,你不能使粗体标记<B>结束. 在你把文件放入服务器中之前,应该先检查以下是否含有类似上述情况的错误.

只嵌入锚链和字符标记mbed Only Anchors and Character Tags
HTML 协议允许你在其他 HTML 标记中嵌入超链:

<H1><A HREF="Destination.html">My heading</A></H1>

不要 在一个锚链中嵌入 HTML 标记:

<A HREF="Destination.html">
<H1>My heading</H1>
</A>

尽管当前的多数浏览器能够处理第二个例子, HTML 的正式说明是不支持这种结构的,你的文件也许在将来的浏览器中将发生问题. 记住,一个浏览器显示不正确编码的文件是可以被原谅的. 但是这种宽容可能不会延续到该软件的下一个版本!当发生疑问时, 就根据 HTML 说明的规定来书写 (参见下面的 其它信息 ).

字符标记可以用在其它元素中改变文本显示模式:

<UL>
<LI><B>A bold list item</B>
<LI><I>An italic list item</I>
</UL>

避免嵌入其它类型的 HTML 元素标记. 例如, 你可能想在一个列表中嵌入标题字体以增大一些字符的显示:

<UL>
<LI><H1>A large heading</H1>
<LI><H2>Something slightly smaller</H2>
</UL>

尽管有些浏览器可以很好地显示这种编码, 这种格式将来是否有效是很难说的,因为它是未定义的 . 为了保证对所有浏览器兼容, 你应该避免使用这种结构. (Netscape 支持一种 <FONT> 标记, 用于指定某个字符在浏览器中显示的大小, 也不是当前官方 HTML 说明中的定义.)

在 <LI> 标记中插入 <B> 标记与在 <LI> 标记中插入 <H1> 标记有什么不同呢? 在訦TML 语义说明中 <H1> 的含义是一个文档中主标题字体的开始,它后面应该跟当前文档的内容. 因此在一个列表中出现 <H1> 时是没有含义的.

字符格式标记通常也不可以附加. 例如, 你可能想这样写:

<B><I>some text</I></B>

期望得到一种加粗的斜体文本. 有些浏览器确实可以; 另外一些浏览器则只解释最内层的标记.

最后的步骤
使你的编码有效
当你把一篇文档放入一个 Web 服务器时, 要确保格式和每个链接正确(包括命名锚链在内). 理想的情况是在你认为一篇文档完成了的时候让其他人浏览一遍并且给出评论.

你可以通过 HTML 有效性服务来验证你的文件是否符合目前普遍接受的 HTML 的标准. 如果你不知道你的文档是否符合 HTML 说明, 这个服务是一个有用的教学工具. 这个服务允许你选择一个校验的级别(如, 严格校验strict, 二级校验level 2, 三级校验level 3).如果你想使用一些非标准的格式,这种自由是很有用的.

替代图像
当<IMG SRC> 标记指向的图像不存在时, 你的浏览器会使用一个替代图像. 在你最后检查你的文件时如果出现了这种情况, 应该确保所指向的图像文件确实存在, 超链使用的 URL 信息正确, 以及文件属性被正确设置(对所有人可读). 然后再检查一遍!

更新你的文件
如果一个文件的内容是静态的 (例如George Washington的个人传记), 可能不会需要更新. 但是对于和时间关系密切的内容,或者包含的领域是经常变化的, 记住不断更新你的文件!

当文件含有诸如每周计划或事件的最后期限这一类信息时,更新是非常重要的. 删除过时的文件或注明为什么有些过期的信息依然在服务器中 (例如, 某个事件在下一轮中的要求和当前内容是相同的,所以该文件过一段时间后仍有参考价值).

浏览器的区别
不同的 Web 浏览器显示的 HTML 元素不尽相同. 记住不是所有的浏览器都能够解释 HTML 文件中所有的标记元素. 不过,浏览器对于不能识别的标记通常只是忽略而已.

你可能花费了很多时间是你的文件在你当前使用的浏览器上“看上去非常漂亮”. 如果你用另一个浏览器察看你的文件, 它很可能看起来不太一样,甚至很不相同. 因此请记住这个建议:使用正确的 HTML 来书写你的文件. 把解释工作留给浏览器,争取得到最好的效果.

注释你的文件
在你的HTML文件中你可能需要留一些注释. HTML 中的注释类似于计算机程序中的注释--你输入的文本不是用于给浏览器显示的,读者也无法直接看到它们,就象计算机程序中的注释是不被程序本身使用的,程序使用者也看不到这些注释. 不过,如果读者看原始文件的话,将可以看到注释.

一般的注释包括更新文件的作者姓名, 生成一个文件所使用的软件和其版本, 或者一些较小的改动信息等.

加入一段注释的格式为:

<!-- 注释内容 -->

你必须包含叹号和连字符.

其他信息
本指南只是一个关于 HTML 的简介, 而不是一个详尽的参考. 下面是一些其他的参考信息. 别忘了先到附近的书店查一查 Web 和 HTML 的书籍.

HTML热门文章排行
网站赞助商
购买此位置

 

关于我们 | 网站地图 | 文档一览 | 友情链接| 联系我们

Copyright © 2003-2024 电脑爱好者 版权所有 备案号:鲁ICP备09059398号