构成网页的基本元素

网页

  2.1题目(TITLE)
   Title元素是文件头中唯一一个必须出现的元素,它也只能出现在文件头中。title元素的格式为:
  <title>文件题目</title>
    title标明该html文件的题目,是对文件内容的概括。一个好的题目应该能使读者从中判断出该文件的大概内容。文件的题目一般不会显示在文本窗口中,而以窗口的名称显示出来。除了标识窗口外,当将某一 homepage 存入书签或文件时,title还用作书签名或缺省的文件名。
  title的长度没有限制,但过长的题目会导致折行,一般情况下它的长度不应超过64个字符。由于title的作用是标明文件内容,所以太短的title也是不可取的,比如:introduction 这个题目,读者不可能根据它判断出本文介绍的是什么。一个好的例子是:
    <titl> 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.

时间: 2024-10-26 04:13:19

构成网页的基本元素的相关文章

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

网页 2.1题目(TITLE) Title元素是文件头中唯一一个必须出现的元素,它也只能出现在文件头中.title元素的格式为: <title>文件题目</title> title标明该html文件的题目,是对文件内容的概括.一个好的题目应该能使读者从中判断出该文件的大概内容.文件的题目一般不会显示在文本窗口中,而以窗口的名称显示出来. 除了标识窗口外,当将某一 homepage 存入书签或文件时,title还用作书签名或缺省的文件名. title的长度没有限制,但过长的题目会导致

用FrontPage建设自己的网站:网页的美化

frontpage|网页 页面修整 通过模板建立的网页,常常预先置放了些标题栏.目录栏(一般叫导航栏),导航栏都是用很多元素组成的,结构上稍稍复杂一些.一般情况下我们不必要对这些东西进行低层次的修改,FrontPage也不允许操作者修改,但在某些项目上,我们还是可以根据自己页面的要求来修改. 操作 修改页面的主标题:在主页(index.htm)的页面上部,模板预置了一个名为"主页"的横幅标题,这个横幅标题和整个主页格格不入.点击横幅,按"Del"键删除,然后在同样位

制作网页的基本要素

在制作网页之前,我们首先应该了解在一个网页中需要哪些要素,今天小编就为大家介绍一下网页的组成要素. 网站的基本元素是网页,一个个的网页构成了一个完整的网站,网页也是可分的,构成网页的基本元素包括标题.网站LOGO.页眉.页脚.主体内容.功能区.导航区.广告栏等.这些元素在网页的位置安排,就是网页的整体布局. 标题 每个网页的最顶端都有一条信息,这条信息往往出现在浏览器的标题栏,而非网页中,但是这条信息也是网页布局中的一部分.这条信息是对这个网页中主要内容的提示,即标题. 网站LOGO LOGO是

Dreamweaver网页的基本要素

在制作网页之前,我们首先应该了解在一个网页中需要哪些要素,今天小编就为大家介绍一下网页的组成要素. 网站的基本元素是网页,一个个的网页构成了一个完整的网站,网页也是可分的,构成网页的基本元素包括标题.网站LOGO.页眉.页脚.主体内容.功能区.导航区.广告栏等.这些元素在网页的位置安排,就是网页的整体布局. 标题 每个网页的最顶端都有一条信息,这条信息往往出现在浏览器的标题栏,而非网页中,但是这条信息也是网页布局中的一部分.这条信息是对这个网页中主要内容的提示,即标题. 网站LOGO LOGO是

用FrontPage建个小窝—网页的美化

  页面的美化 通过模板建立的网页,常常预先置放了些标题栏.目录栏(一般叫导航栏),导航栏都是用很多元素组成的,结构上稍稍复杂一些.一般情况下我们不必要对这些东西进行低层次的修改,FrontPage也不允许操作者修改,但在某些项目上,我们还是可以根据自己页面的要求来修改. 操作修改页面的主标题:在主页(index.htm)的页面上部,模板预置了一个名为"主页"的横幅标题,这个横幅标题和整个主页格格不入.点击横幅,按"Del"键删除,然后在同样位置插入一个事先准备好的

《Dreamweaver CS6完美网页制作——基础、实例与技巧从入门到精通》——1.2 网页的基本构成元素

1.2 网页的基本构成元素 不同性质的网站,构成网页的基本元素是不同的.网页中除了使用文本和图像外,还可以使用丰富多彩的多媒体和Flash动画等. 1.2.1 网站LOGO 网站LOGO也称为网站标志,网站标志是一个站点的象征,也是一个站点是否专业的标志之一.网站的标志应体现该网站的特色.内容以及其内在的文化内涵和理念.成功的网站标志有着独特的形象标识,在网站的推广和宣传中将起到事半功倍的效果.网站标志一般放在网站的左上角,访问者一眼就能看到它.网站标志通常有3种尺寸:88×31.120×60和

手把手教你学Dreamweaver MX 2004(视频教程)

dreamweaver|教程|视频教程 2004年,FIF多媒体制作组推出了 photoshop 视频教程,这是网络中首次推出如此完整系统的的视频教程.作品一经推出,即备受欢迎,好评如潮.据FIF官方统计,photoshop 视频教程访问量总计高达2000万次.现在,FIF联合PConline软件资讯,再次隆重推出 Dreamweaver MX 2004 视频教程.本系列教程将结合实例,深入浅出的讲解,帮助大家轻轻松松的掌握 Dreamweaver MX 2004 的使用方法. 提示:本视频教程

Dreamweaver MX 2004视频宝典教程(3)

dreamweaver|教程 第 03 集:网页的基本元素 课程目标:了解和掌握一个网页的基本构成元素 课程要点:网页是由什么组成的呢?一个网页可能包含图片,文字,超级链接,动画,表单,视频音频等元素中的一种或多种. [全屏观看] | [下载视频]

FrontPage2003建站全攻略1

frontpage|攻略 在浩瀚的Internet建设自己的家园,这是我们的需求,无论是个人.还是组织. 在创建网站之前我们事先在我们的硬盘中建立一个存放站点所有文件的目录. 模板建站 FrontPage可以适合不同个人和组织的需要,自动建立网"巢"--站点. 操作 打开站点建立窗口:点击"文件-->>新建",在打开的窗口中可以看到自动建立站点的各种向导和模板. 向导特点:选择向导程序列出的条件元素,创建某类有个性的站点和网页 模板特点:直接采用已经设计