进入旧版 | 服务项目 | 成功案例 | 联系方式 | 过客留言 | 友情链接
   
设为首页
加入收藏
联系我们
网站首页 | 新闻资讯 | 操作系统 | 办公软件 | 网络软件 | 工具软件 | 媒体动画 | 网页制作 | 网站开发 | 程序开发 | 平面设计
Photoshop视频教程 | Word入门 | Flash入门 | JScript | VBScript | ASP | PHP | ADO | 网页特效 | 3DS MAX6.0命令 | 系统进程
您当前的位置:GOODSGY电脑学习网 -> 网站开发 -> JavaScript -> 文章内容  
HTML超文标记语言概述构成网页的基本元素

  2.1题目(TITLE) www.goodsgy.com

  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) www.goodsgy.com

  标题元素有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> www.goodsgy.com

  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 www.goodsgy.com

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

  2.4.1 无序清单(ul) www.goodsgy.com

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

例 :

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

输出为

●Today
●Tommorow
 
  2.4.2 有序清单<ol> www.goodsgy.com

  有序清单与无序清单相比,只是在输出时清单条目用数字标示,下面是一个例子及其输出:

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

输出为:

1.Today
2.Tommorow

  2.4.3 定义清单<dl> www.goodsgy.com

  定义清单用于对清单条目进行简短说明的场合,用<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 改变条目标记 www.goodsgy.com

  1.改变无序清单条目标记 www.goodsgy.com

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

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

输出为:
●ONE
○TWO
■THREE

  2.改变有序清单条目标记 www.goodsgy.com

  有序清单条目标记的缺省值是阿拉伯数字,可以用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.改变有序清单条目的超始数字 www.goodsgy.com

  有序清单的条目数字在缺省情况下是从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 清单的嵌套 www.goodsgy.com

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

   §2.5 预排版文本<pre> www.goodsgy.com

  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> www.goodsgy.com

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

  §2.7 居中 www.goodsgy.com

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

<h3 align=center>
Wonderful!!
</h3>
<center>
This must be my dream.
</center>
Wonderful!!
This must be my dream.www.goodsgy.com

在百度中搜索:HTML超文标记语言概述构成网页的基本元素
在Google中搜索:HTML超文标记语言概述构成网页的基本元素
在Yahoo中搜索:HTML超文标记语言概述构成网页的基本元素

收藏到网摘:新浪VIVI 365key 我摘 POCO网摘 博采中心 YouNote 和讯网摘 天天收藏
[] [返回上一页] [打 印] [收 藏]

 相关文章    最新文章
· 告诉你html的几个小技巧
· Vista下IE7访问https站点故障排除
· XP下IE7访问HTTPS网页故障解决办法
· [组图] Phtoshop修复模糊照片
· XHTML入门学习教程:框架标签使用
· WEB网站主要的HTML标志和属性
· [组图] ASP.NET构架与安全机制之Http请求处..
· [图文] 使用ASP.NET AJAX框架扩展HTML Map..
· Java程序把Word文档直接转换成Html文件
· PHP原版HTML编码器溢出问题的解决
 
· 用JS解决网站防挂iframe木马的方案
· 技巧 JavaScript常用判断函数
· IE浏览器中一个值得关注的JS问题
· 简易实现DIV圆角的JavaScript代码
· Javascript调用XML制作连动下拉框
· Javascript实现页内查找关键词实例
· JavaScript的系统函数学习
· JavaScript仿Windows关机效果
· javascript弹出窗口问题总结
· 在JS中使用RecordSet对象的GetRows方法

∷相关文章评论∷    (评论内容只代表网友观点,与本站立场无关!) [更多评论…]
站内搜索

精彩图文
  网站导航  
操作系统 办公软件 网络软件
Vista Windows2003 WindowsXP Windows2000/NT Windows9X/ME Linux 其他 Word Excel Powerpoint Outlook 金山系列 其他 网页浏览 上传下载 联络聊天 邮件工具 服务器软件 网络辅助
工具软件 媒体动画 网页制作
系统工具 媒体工具 压缩工具 图文处理 文件管理 其他 3DMAX Authorware Director Maya 视频处理 其他 Flash Dreamweaver FireWorks FrontPage LiveMotion Golive HTML/CSS 其它
网站开发 平面设计 程序设计
ASP JSP PHP CGI JavaScript VBScript XML/SOAP Web服务器 Photoshop PhotoImpact CorelDraw Illustrator Freehand 设计欣赏 其他 VB VC .NET C/C++ DELPHI JAVA

冀ICP备05019428号
Copyright © 2004-2008 电脑学习网 Inc.All rights reserved.
TEL:13832340607
QQ:39873155
E_Mail:goodsgy(#)hotmail.com   (把(#)替换成@)
MSN:goodsgy(#)hotmail.com   (把(#)替换成@)