HTML超文标记语言概述构成网页的基本元素


答案：　　2.1题目(TITLE) 
　　Title元素是文件头中唯一一个必须出现的元素，它也只能出现在文件头中。title元素的格式为： 
　　<title>文件题目</title> 

　　title标明该html文件的题目，是对文件内容的概括。一个好的题目应该能使读者从中判断出该文件的大概内容。文件的题目一般不会显示在文本窗口中，而以窗口的名称显示出来。 
除了标识窗口外，当将某一 homepage 存入书签或文件时，title还用作书签名或缺省的文件名。 

　　title的长度没有限制，但过长的题目会导致折行，一般情况下它的长度不应超过64个字符。由于title的作用是标明文件内容，所以太短的title也是不可取的，比如：introduction 这个题目，读者不可能根据它判断出本文介绍的是什么。一个好的例子是： 

<title>　An Introduction to HTML 2.0 </title> 

　　在头元素中还可以出现其他元素，如<isindex>，<meta>等等。这些元素都不是必须的，而且也不常用。 这些元素的用法和它们的含义可以参考有关文献。 

　　下面是一个最简单的html 文件 

<html> 
<title>the simplest html file</title> 
This is my first html file. 
</html> 

　 §2.2 标题(hn) 
　　标题元素有6种，分别为h1, h2,…h6，用于表示文章中的各种题目。标题号越小，字体越大。一般情况下，浏览器对标题作如下解释： 

　　h1 黑体，特大字体，居中，上下各有两行空行。 
　　h2 黑体，大字体，上下各有一到两行空行 
　　h3 黑体(斜体)，大字体，左端微缩进，上下空行 
　　h4 黑体，普通字体，比h3更多缩进，上边一空行 
　　h5 黑体(斜体)，与h4相同缩进，上边一空行 
　　h6 黑体，与正文有相同缩进，上边一空行 
　　Netscape 2.0为hn的解释为，一律黑体，字体越来越小。 
　 
　　hn可以有对齐属性，align＝#，#表示 
　　left 标题居左 
　　center 标题居中 
　　right 标题居右 

例: <h2 align=center>Chapter 2 </h2> 

　　下面给出hn的例子及其输出： 

<h1>Today is fine!<／h1> Today is fine! 
<h2>Today is fine!<／h2> Today is fine! 
<h3>Today is fine!<／h3> Today is fine! 
<h4>Today is fine!<／h4> Today is fine! 
<h5>Today is fine!<／h5> Today is fine! 
<h6>Today is fine!<／h6> Today is fine! 
　　 
　 §2.3 分段<P> 
　　html的浏览器是基于窗口的，用户可以随时改变显示区的大小，所以html将多个空格以及回车等效为一个空格，这是和绝大多数字处理器不同的。html的分段完全依赖于分段元素<P>。比如下面两段源文件有相同的输出。 

<h2>This is a level Two Heading </h2> 
paragraphy one <p>paragraph two <p> 
… … … … … … … … … … 
<h2>This Is a Level Two Heading</h2> 
paragraph one <p> 
paragraph Two <p> 

<p>也可以有多种属性，比较常用的属性是：aligh＝# #可以是left,center,right,其含义同上 
文。 

　　例<p align=center>This is a centered paragraph <／p>当 html文件中有图形，图形可能占据了窗口的一端，图形的周围可能还有较大的空白区。这时，不带clear属性的 
<p>可能会使文章的内容显示在该空白区内。为确保下一段内容显示在图形的下方，可使用clear属性。clear属性的含义为： 

clear=left 下一段显示在左边界处空白的区域 
clear=right 下一段显示在右边界处空白的区域 
clear=all 下一段的左右两边都不许有别的内容 

　　§2.4 清单List 
　　清单用于列举事实，常用的清单有3种格式，即无序清单(unordered List)，有序清单(ordered list)和定义清单(definition list) 

　　2.4.1 无序清单(ul) 
　　无序清单用(ul)开始，每一个清单条目用<li>引导，最后是</ul>，注意清单条目不需要结尾链接签</Li>。输出时每一清单条目缩进，并且以黑点标示。 

例 ： 

源文件 
<ul> 
<li>Today 
<li>Tommorow 
</ul> 

输出为 

●Today 
●Tommorow 
　 
　 2.4.2 有序清单<ol> 
　　有序清单与无序清单相比，只是在输出时清单条目用数字标示，下面是一个例子及其输出： 

<ol> 
<li>Today 
<li>Tommorow 
</ol> 

输出为： 

1.Today 
2.Tommorow 

　　2.4.3 定义清单<dl> 
　　定义清单用于对清单条目进行简短说明的场合，用<dl>开始，清单条目用<dt>引导，它的说明用<dd>引导。 

<dl> 
<dt>Item 1 
<dd>The definition of item 1 
<dt>Item 2 
<dd>Definition or explaination of item 2 
</dl> 

输出为： 
Item 1 
The definition of item 1 
Item 2 
Definiton or explaination of item 2 

　 2.4.4 改变条目标记 
　　1.改变无序清单条目标记 
　　无序清单输出时，每一条目前都有一个黑色圆点，用户可以用type序性修改条目的标记。type可以是disc 实心圆点　cirde圆圈 square实心方点 

<ul> 
<li type=disc>ONE 
<li type=circle>TWO 
<li type=square>THREE 
</ul> 

输出为： 
●ONE 
○TWO 
■THREE 

　　2.改变有序清单条目标记 
　　有序清单条目标记的缺省值是阿拉伯数字，可以用type属性修改。方法为<Litype=#> 
#=A, 大写字母 

a, 小写字母 
I, 大写罗马数字 
i, 小写罗马数字 
l, 缺省,阿拉伯数字 

<ol><li type=A>ONE-ONE 
<li>ONE-TWO</ol> 
A.ONE-ONE 
B.ONE-TWO 

<ol><li type=a>ONE-ONE 
<li>ONE－TWO</ol> 
a.ONE-ONE 
b.ONE-TWO 

<ol><li type=I>ONE-ONE 
<li>ONE=TWO<／ol> 
Ⅰ.ONE-ONE 
Ⅱ.ONE-TWO 

<ol><li type=i>ONE-ONE 
<li>ONE-TWO<／ol> 
i.ONE-ONE 
ii.ONE-TWO 
<ol><li type=1>ONE-ONE 
<li>ONE-TWO</ol> 
1.ONE-ONE 
2.ONE-TWO 

　 3.改变有序清单条目的超始数字 
　　有序清单的条目数字在缺省情况下是从1开始的，用start属性可修改这一值。方法为<ol start=#> #是条目起始号 

<ol start=5> 
<li type=A>ONE-ONE 
<li>ONE-TWO 
<ol start=10> 
<li>TWO-ONE 
<li type=i>TWO-ONE 
</ol></ol> 

E.ONE-ONE 
F.ONE-TWO 
10.TWO-ONE 
xi.TWO-TWO 

　　2.4.5 清单的嵌套 
　　各种清单可以相互嵌套，每一个清单条目都可以是一个单独的清单。每嵌套一层，清单条目的输出就会有更大的缩进。请参照上面的例子。 

　　 §2.5 预排版文本<pre> 
　　html的输出是基于窗口的，因而html文件在输出时都是要重新排版的，若确实不需要重新排版的内容，可以用<pre>…<／pre>通知浏览器。浏览器在输出时，对这部分内容几乎不做修改地输出，输出的字体电传打字机字体。早期的html规范规定在预排版区内不能出现格式化 
输出的元素。如hn等，Netscapr2.0在遇到预排版元素时，允许其中有其他元素。 

<pre> 
please use your card. 
VISA Master 
<b>Here is an order form.</b> 
<ul><li>Fax 
<li>Air Mail </ul> 
</pre> 

please use your card 
VISA Master 
Here is an order form. 
●Fax 
●Air Mail 

　　§2.6 块引用<BQ> 
　　块引用表示其中的内容是引用。浏览器内对块引用的解释一般为左右缩进，上下各有一空行，有些浏览器还采用斜体字。 

　　§2.7 居中 
　　很多元素都有对齐方式属性，如hn 、p等。也可以直接用居中链接签<center>…<／center> 

<h3 align=center> 
Wonderful!! 
</h3> 
<center> 
This must be my dream. 
</center> 
Wonderful!! 
This must be my dream.
上一个：用一个链接同时打开两个帧页
下一个：Html超文标记语言简明导引
更多图片编程知识: