HTML

HTML(HyperText Mark-up Language)即超文本标记语言或超文本链接标示语言,是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言。设计HTML语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起,形成有机的整体,人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上。我们只需使用鼠标在某一文档中点取一个图标,Internet就会马上转到与此图标相关的内容上去,而这些信息可能存放在网络的另一台电脑中。 HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字图形动画声音表格链接等。HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的具体内容。
  另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。神奇吗?一点都不神奇,因为现在你看到的就是这种语言写的页面!
  也许你听说过许多可以编辑网页的软件,事实上,你不需要用任何专门的软件来建立HTML页面; 你所需要的只是一个文字处理器(如Office Word/记事本/写字板/Gedit/OpenOffice.org等等)以及HTML的工作常识。其实你很快就会发现,基础的HTML语言简直容易死 了。
  HTML只不过是组合成一个文本文件的一系列标签。它们像乐队的指挥,告诉乐手们哪里需要停顿,哪里需要激昂。
  HTML标签通常是英文词汇的全称(如块引用:blockquote)或缩略语(如“p”代表 Paragraph),但它们的与一般文本有区别,因为它们放在单书名号里。故Paragragh标签是<p>,块引用标签 是<blockquote>。有些标签说明页面如何被格式化(例如,开始一个新段落),其他则说明这些词如何显示(<b>使文字 变粗)还有一些其他标签提供在页面上不显示的信息--例如标题。
  关于标签,需要记住的是,它们是成双出现的。每当使用一个标签--如<blockquote>,则必须以另一个标签</blockquote>将它关闭。注意“blockquote”前的斜杠,那就是关闭标签与打开标签的区别。 但是也有一些标签例外。比如,<input>标签就不需要。
  基本HTML页面以DOCTYPE开始,它声明文档的类型,且它之前不能有任何内容(包括换行符和空格),否则将使文档声明无效,接着是<html>标签,以</html>结束。在它们之间,整个页面有两部分--标题和正文。
  标题词--夹在<head>和</head>标签之间--这个词语在 打开页面时出现在屏幕底部最小化的窗口。正文则夹在<body>和</body>之间--即所有页面的内容所在。页面上显示的任 何东西都包含在这两个标签之中。
  那么让我们建立一个简单的范例吧,非常容易的。第一步,当然是要建立一个新的文本文件(记住, 如果你在使用比较复杂的文字处理器,就应该用“纯文本”或“普通文本”来保存),将它命名为“xxxx.html”。(随便你起一个什么名字,扩展名也可 是HTM)。然后你可以用浏览器将它打开,你会看见最简单的自己做的页面。

HTML有什么特点和好处?

HTML文档制作不是很复杂,且功能强大,支持不同数据格式的文件镶入,这也是WWW盛行的原因之一,其主要特点如下:
  1 简易性,HTML版本升级采用超集方式,从而更加灵活方便。
  2 可扩展性,HTML语言的广泛应用带来了加强功能,增加标识符等要求,HTML采取子类元素的方式,为系统扩展带来保证。
  3 平台无关性。虽然PC机大行其道,但使用MAC等其他机器的大有人在,HTML可以使用在广泛的平台上,这也是WWW盛行的另一个原因。用什么可以编辑HTML?
  HTML其实是文本,它需要浏览器的解释,HTML的编辑器大体可以分为三种,
  1 基本编辑软件,使用WINDOWS自带的记事本或写字版都可以编写,当然,如果你用WPS来编写,也可以。不过存盘是请使用.htm或.html作为扩展名,这样浏览器就可以解释执行了。
  2 半所见即所得软件,这种软件能大大提高开发效率,它可以使你在很短的时间内做出HOMEPAGE,且可以学习HTML,这种类型的软件主要有HOTDOG,还有国产的软件网页作坊。
  3 所见即所得软件,使用最广泛的编辑器,完全可以一点不懂HTML的知识就可以做出网页,这类软件主要有FRONTPAGE98,DREAMWEAVER。
   更先进难懂的技术XHTML?
  XHTML中的X是可扩展的意思,XHTML就是可扩展的超文本标记语言,它比HTML有更严 格的要求。如果说HTML是汉语,那么XHTML就是标准普通话。对于现在才刚刚开始学习网页设计的朋友,直接学习XHTML是最佳的选择。事实上它也属 于HTML家族,并且它是基于XML的,对比以前各个版本的HTML,它具有更严格的书写标准、更好的跨平台能力。由于某些需要,XHTML将以前版本的 HTML能够实现的一些功能交给了CSS,这意味着你将需要学习两种技术。但是这确实是Web未来发展的潮流。X代表“可以扩展的”。

HTML标准的版本历史

超文本置标语言(第一版)——在1993年6月发为 互联网工程工作小组 (IETF)工作草案发布(并非标准).
  HTML 2.0——1995年11月作为RFC 1866发布,在RFC 2854于2000年6月发布之后被宣布已经过时
  HTML 3.2——1996年1月14日,W3C推荐标准
  HTML 4.0——1997年12月18日,W3C推荐标准
  HTML 4.01(微小改进)——1999年12月24日,W3C推荐标准
  ISO/IEC 15445:2000(“ISO HTML”)——2000年5月15日发布,基于严格的HTML 4.01语法,是国际标准化组织和国际电工委员会的标准
  XHTML 1.0——发布于2000年1月26日,是W3C推荐标准,后来经过修订于2002年8月1日重新发布。
  XHTML 1.1, 于2001年5月31日发布
  (XHTML 2.0, W3C工作草案)
  HTML没有1.0版本是因为当时有很多不同的版本。有些人认为蒂姆·伯纳斯-李的版本应该算 初版,这个版本没有IMG元素。当时被称为HTML+的后续版的开发工作于1993年开始,最初是被设计成为“HTML的一个超集”。第一个正式规范在为 了和当时的各种HTML标准区分开来,使用了2.0作为其版本号。HTML+的发展继续下去,但是它从未成为标准。
  HTML3.0规范是由当时刚成立的W3C于1995年3月提出,提供了很多新的特性,例如表 格、文字绕排和复杂数学元素的显示。虽然它是被设计用来兼容2.0版本的,但是实现这个标准的工作在当时过于复杂,在草案于1995年9月过期时,标准开 发也因为缺乏浏览器支持而中止了。3.1版从未被正式提出,而下一个被提出的版本是开发代号为Wilbur的HTML 3.2,去掉了大部分3.0中的新特性,但是加入了很多特定浏览器,例如Netscape和Mosaic的元素和属性。HTML对数学公式的支持最后成为 另外一个标准MathML。
  HTML 4.0同样也加入了很多特定浏览器的元素和属性,但是同时也开始“清理”这个标准,把一些元素和属性标记为过时的,建议不再使用它们。HTML的未来和CSS结合会更好。

HTML规范

一、 HTML 头:
  1、针对日文环境:
  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN">
  <html lang="ja">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP">
  <meta http-equiv="Content-Script-Type" content="text/javascript">
  <meta http-equiv="Content-Style-Type" content="text/css">
  <title>yourtitle</title>
  </head>
  2、针对中文环境:
  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=GB2312">
  <meta http-equiv="Content-Script-Type" content="text/javascript">
  <meta http-equiv="Content-Style-Type" content="text/css">
  <title>yourtitle</title>
  </head>
  我们建议的编码格式是utf-8,它支持多语种,并且可以避免出现乱码的情况。
  二、html中javascript的书写:
  <head>…..
  <script type="text/javascript">
  <!—…..-->
  </script>
  </head>
  当然我们不希望你是这样内嵌教本,而是从一个外部文件进行引用,并且只把它放在文档的头部。
  <script src="path/to/script.js" language="javascript" type="text/javascript"></script>
  三、html中元素的书写:
  1、 元素属性值必须包含在双引号中;
  <font color=”#000000” size=”3” face=”Arial”>
  2、 form 中必须加action属性,并且不能为空。
  <form action=”/r/add.cgi” method=”post”>
  如果不需要使用action属性,也必须定义:
  <form action=”no” >
  3、 img的alt属性不可以缺少;
  <img src="/q/img/btn_style.gif" border="0" alt="Select”>
  4、 head与</head>之间必须有title;
  <head>
  ……
  <title>your title </title>
  ……
  </head>
  5、 tr、td必须定义在table之间;
  ….
  
……

  6、 button按钮必须定义在form之间,否则netscape不支持;
  <form action=”……” method=”post”>
  <input type=”button” name=”but” value=”back”>
  </form>
  7、 在javascript中的字符串中出现的“/”前要用转义符“/”:
  <script type=”text/javascript”>
  <!—
  function check(str) {
  var str=”//r//add.cgi”;
  ……
  }
  -->
  </script>
  8、 onclick 属性必须和 onkeypress 成对写( onmousedown + onkeydown、onmouseup + onkeyup)
  mm
  9、 用URL传值时直接写&是不可以的,可用&替换:
  四、缩近规则:
  中,等必须保持严格的缩近规则,以"Tab"键为准:
  

  

  ….
  

  …
  

  

  五、为了检验您的HTML代码是否合法,您可以到W3的HTML Validator工具中进行检验,支持URI输入,上传文件和直接输入代码三种方式进行检验
  http://validator.w3.org/

HTML元素参考手册

(HTML Elements Referencea)
  表示超链接的起始或目的位置。
  acronym
  表示取首字母的缩写词。
  address
  表示特定信息,如地址、签名、作者、文档信息。
  applet
  在页面上放置可执行内容。
  area
  定义一个客户端图像映射中一个超级链接区域的形状、坐标和关联 URL。
  b
  指定文本应以粗体显示。(不建议使用)
  base
  指定一个显式 URL 用于解析对于外部源的链接和引用,如图像和样式表。
  basefont
  设置显示文本时作为默认字体的基础字体值。(不建议使用)
  bdo
  允许作者为选定文本片断禁用双向法则。
  bgsound
  使页面能够带有背景声音或配音。
  big
  指定所含文本要以比当前字体稍大的字体显示。
  blockquote
  表示文本中的一段引用语。
  body
  指明文档主体的开始和结束。
  br
  插入一个换行符。
  button
  指定一个容器,其中所含的 HTML 会被显示为一个按钮。
  caption
  表格的标题,对表格的简单描述。
  center
  将指定文本和图像居中显示。(不建议使用)
  cite
  用斜体显示标明引文。(不建议使用)
  code
  表示代码范例。
  col
  说明基于列的表格缺省属性。
  colgroup
  说明表格中一列或一组列的缺省属性。
  comment
  表示不可见的注释。防止所包含的文本或者HTML源代码被浏览器解析和显示。
  dd
  在定义列表中表示定义。定义通常在定义列表中缩进显示。
  del
  表示文本已经从文档中删除。
  dfn
  表示术语的定义。(不建议使用)
  dir
  表示目录列表。(不建议使用)
  div
  表示一块可显示 HTML 的区域
  dl
  表示定义列表。
  dt
  在定义列表中表示定义术语。
  em
  强调文本,通常以斜体显示。
  embed
  允许嵌入任何类型的文档。
  fieldset
  在字段集包含的文本和其它元素外面画一个方框。
  font
  用于说明所包含文本的新字体、大小和颜色。
  form
  说明所包含的控件是某个表单的组成部分。
  frame
  在 FRAMESET 元素内表示单个框架。
  frameset
  表示一个框架集,用于组织多个框架和嵌套框架集。
  head
  提供了关于文档的无序信息集合。
  h1-h6
  这实际上是6个标签,他们以标题样式显示文本,h1最大,h6最小。
  hr
  水平线。
  html
  表明文档包含 HTML 元素。
  i
  指定文本应以斜体显示。(不建议使用)
  iframe
  创建内嵌漂浮框架。
  img
  在文档中嵌入图像或视频片断。
  input
  创建各种表单输入控件。
  input type=button
  创建按钮控件。
  input type=checkbox
  创建复选框控件。
  input type=file
  创建文件上载控件,该控件带有一个文本框和一个浏览按钮。
  input type=hidden
  传输关于客户/服务器交互的状态信息。
  input type=image
  创建一个图像控件,该控件被点击后将导致表单立即被提交。
  input type=password
  创建与 INPUT type=text 控件类似的单行文本输入控件,不过并不显示用户输入的内容。
  input type=radio
  创建单选钮控件。
  input type=reset
  创建一个按钮,点击该按钮后,将重置表单控件回其初始值。
  input type=submit
  创建一个按钮,点击该按钮后,即提交表单。
  input type=text
  创建一个单行的文本输入控件。
  ins
  表示插入到文档中的文本。
  isindex
  使浏览器显示一个对话框,提示用户输入单行文本。(不建议使用)
  kbd
  以定宽字体显示文本。(不建议使用)
  label
  为页面上的其它元素指定标签。
  legend
  在 fieldSet 对象绘制的方框内插入一个标题。
  li
  表示列表中的一个项目。
  link
  允许当前文档和外部文档建立连接。
  listing
  以固定宽度的字体显示文本。
  map
  包含客户端图像映射的坐标数据。
  marqueee
  创建一个滚动的文本字幕。(不建议使用)
  menu
  创建一个无序列表。
  meta
  向服务器和客户端传达关于文档的隐藏信息。
  nobr
  不换行显示文本。
  noframes
  包含对于那些不支持 FRAMESET 元素的浏览器使用的 HTML。
  noscript
  指定在不支持脚本的浏览器中显示的 HTML。
  object
  在 HTML 页面中插入对象。
  ol
  编制排序列表。
  optgroup
  允许作者对 select 元素中的选项进行逻辑分组。
  option
  表示 SELECT 元素中的一个选项。
  p
  表示一段。
  param
  设置 APPLET、EMBED 或 OBJECT 元素的属性初始值。
  pre
  以固定宽度字体显示文本。
  q
  分离文本中的引语。
  s
  带删除线方式显示文本。(不建议使用)
  samp
  表示代码范例。
  script
  指定由脚本引擎解释的页面中的脚本。
  select
  表示一个列表框或者一个下拉框。
  small
  指定内含文本要以比当前字体稍小的字体显示。
  span
  指定内嵌文本容器。
  strike
  带删除线显示文本。(不建议使用)
  strong
  以粗体显示文本。
  style
  指定页面的样式表。
  sub
  说明内含文本要以下标的形式显示,比当前字体稍小。
  sup
  说明内含文本要以上标的形式显示,比当前字体稍小。
  table
  说明所含内容组织成含有行和列的表格形式。
  tbody
  指明哪些行作为表格的主体。
  td
  指定表格中的单元格。
  textarea
  多行文本输入控件。
  tfoot
  指明哪些行作为表尾。
  th
  指定标题列。标题列将在单元格中居中并以粗体显示。
  thead
  指定哪些行作为表头。
  title
  文档的标题。
  tr
  指定表格中的一行。
  tt
  以固定宽度字体显示文本。(不建议使用)
  u
  带下划线显示文本。(不建议使用)
  ul
  表示不排序的项目列表。
  var
  定义程序变量,通常以斜体显示。
  wbr
  向一块 NOBR 文本中插入软换行。
  文章来自:http://www.admin5.com/html/html_tag_ref/050_html_elements_ref.html
   XHTML的一些基础知识,以及和HTML的一些区别
  
HTML语言是我们建立网页的工具,从它出现发展到现在,规范不断完善,功能越来越 强。但是依然有缺陷和不足,人们仍在不断的改进它,使它更加便于控制和有弹性,以适应网络上日新月异的应用需求。2000年底,国际W3C(World Wide Web Consortium)组织公布发行了XHTML 1.0版本,XHTML和HTML,XML有什么不同,它增加了什么新功能,今天就让我们来初步认识一下XHTML。
  XHTML 1.0是一种在HTML 4.0基础上优化和改进的的新语言,目的是基于XML应用。XHTML是一种增强了的HTML,它的可扩展性和灵活性将适应未来网络应用更多的需求。下面 是W3C的HTML工作组主席Steven pemberton回答的关于XHTML的常见基础问题。
  问:什么是XHTML?
  答:XHTML是一种为适应XML而重新改造的HTML。当XML越来越成为一种趋势,就出现 了这样一个问题:如果我们有了XML,我们是否依然需要HTML?为了回答这个问题,1998年5月我们在旧金山开了两天的工作会议,会议的结论是:需 要。我们依然需要使用HTML。因为大量的人们已经习惯使用HTML来作为他们的设计语言,而且,已经有数以百万计的页面是采用HTML编写的。
  问:为什么XHTML 1.0相对HTML 4.0独立发展?
  答:并不是这样。XHTML恰恰就是HTML 4.0的重新组织,(确切的说它是HTML 4.01,是一个修正版本的HTML 4.0,只不过以XHTML 1.0命名发行。) 它们在XML里的解释会有一些必要的差别,但另一方面,它们依然非常相似,我们可以把XHTML的工作看作是HTML 4.0基础上的延续。
  问:XHTML 1.0如何实现XML标准?
  答:XHTML就是一种XML应用。它采用XML的DTD文件格式定义,并运行在支持XML的 系统上。这里要感谢XML的Namespaces功能,浏览器制造商不需要再创造新的私有标签(tags),他们只需要在XHTML代码里包含XML代码 片段,或者XML代码里包含XHTML代码片段。
  问:XHTML 1.0最主要的优势是什么?
  答:XML是web发展的趋势,所以人们急切的希望加入XML的潮流中。使用XHTML 1.0,只要你小心遵守一些简单规则,就可以设计出既适合XML系统,又适合当前大部分HTML浏览器的页面。这个意思就是说,你可以立刻设计使用 XML,而不需要等到人们都使用支持XML的浏览器。这个指导方针可以使web平滑的过渡到XML。
  另一个使用XHTML的优势是:它非常严密。当前网络上的HTML的糟糕情况让人震惊,早期的 浏览器接受私有的HTML标签,所以人们在页面设计完毕后必须使用各种浏览器来检测页面,看是否兼容,往往会有许多莫名其妙的差异,人们不得不修改设计以 便适应不同的浏览器。
  用XML我们可以重新建立制度,浏览器制造商联合采用"严格的错误防御标准",如果XML代码不兼容,浏览器拒绝显示页面,这样设计工作在发布前必须修正每一个错误。
  问:用XHTML,网页设计师会遇到和HTML一样的浏览器兼容性问题吗?
  答:希望不会。"严格的错误防御标准"将帮助浏览器对代码作出相同的响应,XML的 namespaces功能使你可以增加自己的新标签而不需要特别的浏览器支持。现在我们所需要得到保证的就是:所有浏览器开发商一致并且完全遵守我们制定 的CSS。写信给你的浏览器制造商,告诉你需要的CSS规范,你甚至可以检测浏览器是否听从你的设计。
  问:学习XHTML是否很困难?
  答:一点也不!
  问:谁可以采用XHTML 1.0设计?
  答:因为XHTML非常简单易于实现,所以任何会用HTML的人都可以容易地使用XHTML。当使用XML浏览器的人们越来越多,更多的工作会被建议使用XML,那时候也许都将使用XHTML。
  问:什么时候XHTML网站会普及?
  答:好问题。我已经看到一些使用XHTML建立的网站,甚至在XHTML 1.0发布以前。我相信它将会有一个大发展,因为它太容易了。但是现在的用户代理(浏览器)对XHTML都不是完全支持,而是部分支持,所以XHTML的普及还需要用户代理的进一步支持。
  问:我们如何将现有的HTMl转换为XHTML?
  答:非常简单,因为它们非常相似。在W3C(www.w3c.org)网站上有一个开放原代码(open-source)的软件叫HTML Tidy,可以帮助你直接转换。
  问:XHTML未来会怎样?
  答:XHTML1.0仅仅是这个新HTML语言的第一步。新版本将没有向下兼容老浏览器的约束,可以有更多的发展空间。
  首先,我们将进行一次彻底的清理,删除HTML 4.0中不兼容的元素。
  其次,我们将XHTML模块化,允许人们在XML应用中使用XHTML模块(比如表格),减少重复开发。同时也允许开发特别用途的设计,比如电话应用,只要属于XHTML的子集就可以保持兼容,人们可以创造他们自己的HTML。

常用的HTML编辑软件

Dreamweaver
  Dreamweaver是美国Adobe(原Macromedia,2005年被Adobe收 购)公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制 作出跨越平台限制和跨越浏览器限制的充满动感的网页。它不仅是优秀的WYSIWYG编辑器,更是优秀的代码编辑器,有代码加亮,代码提示等丰富功能,提供 各种示例代码,并支持Javascript,PHP,ASP,JSP等多种脚本语言。最新版本为CS4,发布于2008年9月。
  Frontpage
  Microsoft公司出品的FrontPage是制作表单式网页的常用工具。 FrontPage 2000是微软公司最新推出的面向21世纪网络办公自动化时代的大型套装软件0ffice 2000中新增的一个重要组件,也是0ffice 2000注重网络与Internet应用的一个重要体现。FrontPage 2000是目前最常用的中文版网页制作工具之一,简单易学。FrontPage 2000相对于前面的版本在网页向导、网页编辑、表单与框架页技术、音频与视频插件、动态HTML技术(DHTML,上世纪末兴起的一种web技术,现在 已经过时)、数据库连接等方面进行了重大的改进,从而增强了网页制作的功能。如果服务器安装了Frontpage扩展组件,还可以支持Frontpage 的站点计数器等功能。它从2007版的Office开始更名为Sharepoint Designer。
  Delphi
  由Borland公司推出的Delphi是全新的可视化编程环境,为我们提供了一种方便、快捷 的Windows应用程序开发工具。它使用了Microsoft Windows图形用户界面的许多先进特性和设计思想,采用了弹性可重复利用的完整的面向对象程序语言(Object-Oriented Language)、当今世界上最快的编辑器、最为领先的数据库技术。对于广大的程序开发人员来讲,使用Delphi开发应用软件,无疑会大大地提高编程 效率,而且随着应用的深入,您将会发现编程不再是枯燥无味的工作——Delphi的每一个设计细节,都将带给您一份欣喜。
  eclipse
  Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境。幸运的是,Eclipse 附带了一个标准的插件集,包括 Java 开发工具(Java Development Tools,JDT)。

UTF-8和GB2312网页编码

最近有好多学生问我网页的编码问题,gb2312和utf-8编码有什么区别呢?今天总结下:
  不知道大家在做页面的时候会不会遇到样式定义不生效的问题,基本的表现就是怎么改样式都没显示或只有某些浏览器正常,这时通常需要做下面的几步:
  确认所修改的样式文件是否是当前页面的样式文件(多个环境的情况)
  确认文件中的路径是否正确(可能手误多写或少写)
  如果上面两点都确认没问题或只是一部分样式失效,基本可以确定是文件的编码问题
  大家都知道使用“UTF-8”比“GB2312”跨平台的兼容性更好,却不一定知道文件的编码 跟文件编码的申明不是一回事,以为只要申明了文件的编码类型就是改了文件的编码,导致很多时候只是简单的申明了文件的编码类型,而并没有真的修改文件编码 类型,当浏览器以申明的编码类型去解析文件时,由于文件的实际编码跟申明不同,出现解析不正确的问题。
   以上问题如何产生呢?
  只修改了申明,没有保存与申明对应的文件编码类型
  在不同文件间拷贝时,两个文件间的编码不一样
  上面的问题只要再另存一份,选择跟申明一样的编码类型即可解决。
  如果上面的方法都没有作用的话,可能就是编辑软件的问题啦,建议换个编辑器试试。
  目前我知道的会有问题的编辑器:
  EmEditor Professional v7.50 Alpha 5(可能还是Alpha版本的关系,在UTF-8不加签名时,如果样式注释结尾出现特定的中文,如“不、用、接、名、近、见、鬼、评、论、的、出、写、 下、现、面、日”等,会导致之后的内容无法被IE7解析)
  Editplus(不知道是哪个版本了,有人知道请告诉我,保存UTF-8加签名时,签名会导致内容无法被解析)
  注:以上说的都是指样式部分,包括页面中的样式和独立的样式文件。

HTML基本标签参考

基 本 标 签
  创建一个HTML文档 <html></html>
  设置文档标题以及其他不在WEB网页上显示的信息 <head></head>
  设置文档的可见部分 <body></body>
   标 题 标 签
  将文档的题目放在标题栏中 <title></title>
   文 档 整 体 属 性
  设置背景颜色,使用名字或十六进制值 <body bgcolor=?>
  设置文本文字颜色,使用名字或十六进制值 <body text=?>
  设置链接颜色,使用名字或十六进制值 <body link=?>
  设置已使用的链接的颜色,使用名字或十六进制值 <body vlink=?>
  设置正在被击中的链接的颜色,使用名字或十六进制值 <body alink=?>
   文 本 标 签
  创建预格式化文本 <pre></pre>
  创建最大的标题 <h1></h1>
  创建最小的标题 <h6></h6>
  创建黑体字 <b></b>
  创建斜体字 <i></i>
  创建打字机风格的字体 <tt></tt>
  创建一个引用,通常是斜体 <cite></cite>
  加重一个单词(通常是斜体加黑体) <em></em>
  加重一个单词(通常是斜体加黑体) <strong></strong>
  设置字体大小,从1到7 <font size=?></font>
  设置字体的颜色,使用名字或十六进制值 <font color=?></font>
   链 接
  

  创建一个超链接 <a href="URL"></a>
  创建一个自动发送电子邮件的链接 <a href="mailto:EMAIL">.... </a>
  创建一个位于文档内部的靶位 <a name="NAME"></a>
  创建一个指向位于文档内部靶位的链接 <a href="#NAME"></a>
   格 式 排 版
  创建一个新的段落 <p>
  将段落按左、中、右对齐 <p align=?>
  插入一个回车换行符 <br>
  从两边缩进文本 <blockquote>
  </blockquote>
  创建一个定义列表 <dl></dl>
  放在每个定义术语词之前 <dt>
  放在每个定义之前 <dd>
  创建一个标有数字的列表 <ol></ol>
  放在每个数字列表项之前,并加上一个数字 <li>
  创建一个标有圆点的列表 <ul></ul>
  放在每个圆点列表项之前,并加上一个圆点 <li>
  一个用来排版大块HTML段落的标签,也用于格式化表 <div align=?>
   图 形 元 素
  

  添加一个图像 <img src="name">
  排列对齐一个图像:左中右或上中下 <img src="name" align=?>
  设置围绕一个图像的边框的大小 <img src="name" border=?>
  加入一条水平线 <hr>
  设置水平线的大小(高度) <hr size=?>
  设置水平线的宽度(百分比或绝对像素点) <hr width=?>
  创建一个没有阴影的水平线 <hr noshade>
   表 格
  创建一个表格 <table></table>
  开始表格中的每一行 <tr></tr>
  开始一行中的每一个格子 <td></td>
  设置表格头:一个通常使用黑体居中文字的格子 <th></th>
   表 格 属 性
  设置围绕表格的边框的宽度 <table border=#>
  设置表格格子之间空间的大小 <table cellspacing=#>
  设置表格格子边框与其内部内容之间空间的大小 <table cellpadding=#>
  设置表格的宽度-用绝对像素值或文档总宽度的百分比 <table width=# or %>
  设置表格格子的水平对齐(左中右) <tr align=?> or <td align=?>
  设置表格格子的垂直对齐(上中下) <tr valign=?> or <td valign=?>
  设置一个表格格子应跨占的列数(缺省为1) <td colspan=#>
  设置一个表格格子应跨占的行数(缺省为1) <td rowspan=#>
  禁止表格格子内的内容自动断行回卷 <td nowrap>
   窗 框
  放在一个窗框文档的<body>标签之前,也可以嵌在其他窗框文档中 <frameset></frameset>
  定义一个窗框内的行数,可以使用绝对像素值或高度的百分比 <frameset rows="value,value">
  定义一个窗框内的列数,可以使用绝对像素值或宽度的百分比 <frameset cols="value,value">
  定义一个窗框内的单一窗或窗区域 <frame>
  定义在不支持窗框的浏览器中显示什么提示 <noframes></noframes>
   窗 框 属 性
  规定窗框内显示什么HTML文档 <frame src="URL">
  命名窗框或区域以便别的窗框可以指向它 <frame name="name">
  定义窗框左右边缘的空白大小,必须大于等于1 <frame marginwidth=#>
  定义窗框上下边缘的空白大小,必须大于等于1 <frame marginheight=#>
  设置窗框是否有滚动栏,其值可以是"yes","no","auto",缺省时一般为"auto" <frame scrolling=VALUE>
  禁止用户调整一个窗框的大小 <frame noresize>
   表 单
  

  对于功能性的表单,一般需要运行一个CGI小程序,HTML仅仅是产生表单的表面样子。
  创建所有表单 <form></form>
  创建一个滚动菜单,size设置在需要滚动前可以看到的表单项数目 <select multiple name="NAME" size=?></select>
  设置每个表单项的内容 <option>
  创建一个下拉菜单 <select name="NAME"></select>
  设置每个菜单项的内容 <option>
  创建一个文本框区域,列的数目设置宽度,行的数目设置高度 <textarea name="NAME" cols=40 rows=8></textarea>
  创建一个复选框,文字在标签后面 <input type="checkbox" name="NAME">
  创建一个单选框,文字在标签后面 <input type="radio" name="NAME" value="x">
  创建一个单行文本输入区域,size设置以字符计的宽度 <input type=text name="foo" size=20>
  创建一个submit(提交)按钮 <input type="submit" value="NAME">
  创建一个使用图象的submit(提交)按钮 <input type="image" border=0 name="NAME" src="name.gif">
  创建一个reset(重置)按钮 <input type="reset">

HTML标签大全

<!> 跑马灯
  <marquee>...</marquee>普通卷动
  <marquee behavior=slide>...</marquee>滑动
  <marquee behavior=scroll>...</marquee>预设卷动
  <marquee behavior=alternate>...</marquee>来回卷动
  <marquee direction=down>...</marquee>向下卷动
  <marquee direction=up>...</marquee>向上卷动
  <marquee direction=right></marquee>向右卷动
  <marquee direction=left></marquee>向左卷动
  <marquee loop=2>...</marquee>卷动次数
  <marquee width=180>...</marquee>设定宽度
  <marquee height=30>...</marquee>设定高度
  <marquee bgcolor=FF0000>...</marquee>设定背景颜色
  <marquee scrollamount=30>...</marquee>设定卷动距离
  <marquee scrolldelay=300>...</marquee>设定卷动时间
   <!>字体效果
  <h1>...</h1>标题字(最大)
  <h6>...</h6>标题字(最小)
  <b>...</b>粗体字
  <strong>...</strong>粗体字(强调)
  <i>...</i>斜体字
  <em>...</em>斜体字(强调)
  <dfn>...</dfn>斜体字(表示定义)
  <u>...</u>底线
  <ins>...</ins>底线(表示插入文字)
  <strike>...</strike>横线
  <s>...</s>删除线
  <del>...</del>删除线(表示删除)
  <kbd>...</kbd>键盘文字
  <tt>...</tt> 打字体
  <xmp>...</xmp>固定宽度字体(在文件中空白、换行、定位功能有效)
  <plaintext>...</plaintext>固定宽度字体(不执行标记符号)
  <listing>...</listing> 固定宽度小字体
  <font color=00ff00>...</font>字体颜色
  <font size=1>...</font>最小字体
  <font style =font-size:100 px>...</font>无限增大
   <!>区断标记
  <hr>水平线
  <hr size=9>水平线(设定大小)
  <hr width=80%>水平线(设定宽度)
  <hr color=ff0000>水平线(设定颜色)
  <br>(换行)
  <nobr>...</nobr>水域(不换行)
  <p>...</p>水域(段落)
  <center>...</center>置中
   <!>连结格式
  <base href=地址>(预设好连结路径)
  <a href=地址></a>外部连结
  <a href=地址 target=_blank></a>外部连结(另开新窗口)
  <a href=地址 target=_top></a>外部连结(全窗口连结)
  <a href=地址 target=页框名></a>外部连结(在指定页框连结)
   <!>贴图/音乐
  <img src=图片地址>贴图
  <img src=图片地址 width=180>设定图片宽度
  <img src=图片地址 height=30>设定图片高度
  <img src=图片地址 alt=提示文字>设定图片提示文字
  <img src=图片地址 border=1>设定图片边框
  <bgsound src=MID音乐文件地址>背景音乐设定
   <!>表格语法
  <table aling=left>...</table>表格位置,置左
  <table aling=center>...</table>表格位置,置中
  <table background=图片路径>...</table>背景图片的URL=就是路径网址
  <table border=边框大小>...</table>设定表格边框大小(使用数字)
  <table bgcolor=颜色码>...</table>设定表格的背景颜色
  <table borderclor=颜色码>...</table>设定表格边框的颜色
  <table borderclordark=颜色码>...</table>设定表格暗边框的颜色
  <table borderclorlight=颜色码>...</table>设定表格亮边框的颜色
  <table cellpadding=参数>...</table>指定内容与网格线之间的间距(使用数字)
  <table cellspacing=参数>...</table>指定网格线与网格线之间的距离(使用数字)
  <table cols=参数>...</table>指定表格的栏数
  <table frame=参数>...</table>设定表格外框线的显示方式
  <table width=宽度>...</table>指定表格的宽度大小(使用数字)
  <table height=高度>...</table>指定表格的高度大小(使用数字)
  <td colspan=参数>...</td>指定储存格合并栏的栏数(使用数字)
  <td rowspan=参数>...</td>指定储存格合并列的列数(使用数字)
   <!>分割窗口
  <frameset cols="20%,*">左右分割,将左边框架分割大小为20%右边框架的大小浏览器会自动调整
  <frameset rows="20%,*">上下分割,将上面框架分割大小为20%下面框架的大小浏览器会自动调整
  <frameset cols="20%,*">分割左右两个框架
  <frameset cols="20%,*,20%">分割左中右三个框架
  <分割上下两个框架
  <frameset rows="20%,*,20%">分割上中下三个框架
  <A HREF TARGET> 指定超级链接的分割窗口
  <A HREF=#锚的名称> 指定锚名称的超级链接
  <A HREF> 指定超级链接
  <A NAME=锚的名称> 被连结点的名称
  <ADDRESS>....</ADDRESS> 用来显示电子邮箱地址
  <B> 粗体字
  <BASE TARGET> 指定超级链接的分割窗口
  <BASEFONT SIZE> 更改预设字形大小
  <BGSOUND SRC> 加入背景音乐
  <BIG> 显示大字体
  <BLINK> 闪烁的文字
  <BODY TEXT LINK VLINK> 设定文字颜色
  <BODY> 显示本文
  <BR> 换行
  <CAPTION ALIGN> 设定表格标题位置
  <CAPTION>...</CAPTION> 为表格加上标题
  <CENTER> 向中对齐
  <CITE>...<CITE> 用于引经据典的文字
  <CODE>...</CODE> 用于列出一段程序代码
  <COMMENT>...</COMMENT> 加上批注
  <DD> 设定定义列表的项目解说
  <DFN>...</DFN> 显示"定义"文字
  <DIR>...</DIR> 列表文字卷标
  <DL>...</DL> 设定定义列表的卷标
  <DT> 设定定义列表的项目
  <EM> 强调之用
  <FONT FACE> 任意指定所用的字形
  <FONT SIZE> 设定字体大小
  <FORM ACTION> 设定户动式窗体的处理方式
  <FORM METHOD> 设定户动式窗体之资料传送方式
  <FRAME MARGINHEIGHT> 设定窗口的上下边界
  <FRAME MARGINWIDTH> 设定窗口的左右边界
  <FRAME NAME> 为分割窗口命名
  <FRAME NORESIZE> 锁住分割窗口的大小
  <FRAME SCROLLING> 设定分割窗口的滚动条
  <FRAME SRC> 将HTML文件加入窗口
  <FRAMESET COLS> 将窗口分割成左右的子窗口
  <FRAMESET ROWS> 将窗口分割成上下的子窗口
  <FRAMESET>...</FRAMESET> 划分分割窗口
  <H1>~<H6> 设定文字大小
  <HEAD> 标示文件信息
  <HR> 加上分网格线
  <HTML> 文件的开始与结束
  <I> 斜体字
  <IMG ALIGN> 调整图形影像的位置
  <IMG ALT> 为你的图形影像加注
  <IMG DYNSRC LOOP> 加入影片
  <IMG HEIGHT WIDTH> 插入图片并预设图形大小
  <IMG HSPACE> 插入图片并预设图形的左右边界
  <IMG LOWSRC> 预载图片功能
  <IMG SRC BORDER> 设定图片边界
  <IMG SRC> 插入图片
  <IMG VSPACE> 插入图片并预设图形的上下边界
  <INPUT TYPE NAME value> 在窗体中加入输入字段
  <ISINDEX> 定义查询用窗体
  <KBD>...</KBD> 表示使用者输入文字
  <LI TYPE>...</LI> 列表的项目 ( 可指定符号 )
  <MARQUEE> 跑马灯效果
  <MENU>...</MENU> 条列文字卷标
  <META NAME="REFRESH" CONTENT URL> 自动更新文件内容
  <MULTIPLE> 可同时选择多项的列表栏
  <NOFRAME> 定义不出现分割窗口的文字
  <OL>...</OL> 有序号的列表
  <OPTION> 定义窗体中列表栏的项目
  <P ALIGN> 设定对齐方向
  <P> 分段
  <PERSON>...</PERSON> 显示人名
  <PRE> 使用原有排列
  <SAMP>...</SAMP> 用于引用字
  <SELECT>...</SELECT> 在窗体中定义列表栏
  <SMALL> 显示小字体
  <STRIKE> 文字加横线
  <STRONG> 用于加强语气
  <SUB> 下标字
  <SUP> 上标字
  <TABLE BORDER=n> 调整表格的宽线高度
  <TABLE CELLPADDING> 调整数据域位之边界
  <TABLE CELLSPACING> 调整表格线的宽度
  <TABLE HEIGHT> 调整表格的高度
  <TABLE WIDTH> 调整表格的宽度
  <TABLE>...</TABLE> 产生表格的卷标
  <TD ALIGN> 调整表格字段之左右对齐
  <TD BGCOLOR> 设定表格字段之背景颜色
  <TD COLSPAN ROWSPAN> 表格字段的合并
  <TD NOWRAP> 设定表格字段不换行
  <TD VALIGN> 调整表格字段之上下对齐
  <TD WIDTH> 调整表格字段宽度
  <TD>...</TD> 定义表格的数据域位
  <TEXTAREA NAME ROWS COLS> 窗体中加入多少列的文字输入栏
  <TEXTAREA WRAP> 决定文字输入栏是自动否换行
  <TH>...</TH> 定义表格的标头字段
  <TITLE> 文件标题
  <TR>...</TR> 定义表格美一行
  <TT> 打字机字体
  <U> 文字加底线
  <UL TYPE>...</UL> 无序号的列表 ( 可指定符号 )
  <VAR>...</VAR> 用于显示变量

HTML标签和属性的语义化

分离结构与表现的另一个重要方面是使用语义化的标记来构造文档内容。一个 XHTML 元素的存在就意味被标记内容的那部分有相应的结构化的意义,没有理由使用其他的标记。换句话说,不要让 CSS 使一个 HTML 元素看起来就像另一个 HTML 元素,比如用<div>来代替<p>标记标题。
  首先是关于语义(Semantics)和默认样式的区别,默认样式是浏览器设定的一些常用 tag的表现形式,个人认为他的主要目的就是让大家直观的认识标签(markup)和属性(attribute)的用途和作用,很明显Hx系列看起来很像 标题,因为拥有粗体和较大的字号。<strong>,<em>用来区别于其他文字,起到了强调的作用。至于列表和表格很明显的告 诉你他们是做什么的。
  其次,语义化的网页的好处,最主要的就是对搜索引擎友好,又了良好的结构和语义你的网页内容自然容易被搜索引擎抓取,你网站的推广便可以省下不少的功夫。
  具体的语义和用途在,XHTML1.0 TAG 参考中都已经说明,这里将一些容易遗忘或者混淆的TAGS和属性予以补充。
   <Hx>
  <h1>、<h2>、<h3>、<h4>、<h5>、<h6>,作为标题使用,并且依据重要性递减。<h1>是最高的等级。
  例如:
  <h1>文档标题</h1>
  <h2>次级标题</h2>
  而不要使用
  <div class=/"title/">文档标题</div>,或者<span class=/"title/">文档标题</span>.很明显搜索引擎对于后者是不会认为他是标题的。
   <p>
  段落标记,知道了<p>作为段落,你就不会再使用<br/>来换行 了,而且不需要<br/><br/>来区分段落与段落。<p></p>中的文字会自动换行,而且换行的 效果优于<br>。段落与段落之间的空隙也可以利用CSS来控制,很容易而且清晰的区分出段落与段落。在利用行高(line-height) 很容易的定义出行间距,再定义首字下沉等效果,那就挺完美了。
  例如:
  <p>在利用行高(line-height)很容易的定义出行间距,再定义首字下沉等效果,那就挺完美了。</p>
   <ul>、<ol>、<li>
  <ul>无序列表,很常见的到了大家广泛的使用,<ol>有序列表也 挺常用。在web标准化过程中,<ul>还被更多的用于导航条,本来导航条就是个列表,这样做是完全正确的,而且当你的浏览器不支持CSS的 时候,导航链接仍然很好使,就是美观方面差了一点。
  例如:
  <ul>
  <li>项目一</li>
  <li>项目二</li>
  <li>项目三</li>
  </ul>
  <ol>
  <li>第一章</li>
  <li>第二章</li>
  <li>第三章</li>
  </ol>
   <dl>、<dt>、<dd>
  dl就是“定义列表”。比如说词典里面的词的解释、定义就可以用这种列表。
  例如:
  <dl>
  <dt>Dog</dt>
  <dd>A carnivorous mammal of the family Canidae.</dd>
  </dl>
  <dl>
  <dt>上海滩</dt>
  <dd>这部拍摄于1980年的《上海滩》堪称是香港电视史上最成功、最经典的剧集。
  当年在香港播出以后,产生了巨大的轰动效应。</dd>
  <dt>周润发</dt>
  <dd>和所有伟大的影星一样,周润发印证了一个时代,一个香港电影的黄金时代。
  风衣墨镜、冷血双枪、阳光微笑,都封存胶片之中,当我们回首寻望的时候,发哥已被刻为一个时代的坐标。</dd>
  </dl>
   <cite>、cite 、<q>、 <blockquote>
  论坛和blog经常会用到引用别人的话,用<q>来标记简短的单行引用。Web浏 览器会自动识别在<q> 之间的内容。不幸的是,IE不能识别,并且有些时候, <q>会引起一些可访问性(Accessibility)的问题。正因为如此,一些人建议尽量不要使用 <q>,手动的插入引用标记。在一个包含适当的类的 <span>中加入单行的引用内容,那么就可以用CSS来给引用设计样式了,但是这个没有语义上的意义。CSS可以用来定义引用的样式。注 意,一段文章是不可以直接放在<blockquote>中的,引用的内容还必须包含在一个元素中,通常是<p>。属性cite既 可以与<q> 一起用,也可以与<blockquote>一起用,用来提供引用内容的来源地址。需要注意的是,如果你使用 <span>来代替 <q>标记引用内容,那么你就不能使用 cite属性了。
  例如:
  <cite>Designing with Web Standards</cite> is an excellent book by Jeffrey Zeldman.
  <p> <cite>孔子</cite>曰:<q>学而不思则罔,思而不学则殆</q>.</p>
  <p>The W3C says that <q cite=/"http://www.w3.org/TR/REC-html40/
  struct/text.html#h-9.2.1/">The presentation of phrase elements
  depends on the user agent.</q>.</p>
  <blockquote cite=/"http://www.w3cn.org//">
  <p>“我们大部分人都有深刻体验,每当主流浏览器版本的升级,我们刚建立的网站就可能变得过时,
  我们就需要升级或者重新建造一遍网站。例如1996-1999年典型的/"浏览器大战/",
  为了兼容 Netscape 和 IE,网站不得不为这两种浏览器写不同的代码。同样的,
  每当新的网络技术和交互设备的出现,我们也需要制作一个新版本来支持这种新技术或新设备,
  例如支持手机上网的 WAP 技术。类似的问题举不胜举:网站代码臃肿、繁杂浪费了我们大量的带宽;
  针对某种浏览器的 DHTML 特效,屏蔽了部分潜在的客户;不易用的代码,残障人士无法浏览网站等等。
  这是一种恶性循环,是一种巨大的浪费。”</p>
  </blockquote>
   <em>、 <strong>
  <em> 是用作强调的,<strong>是用作重点强调的。 大部分浏览器用斜体显示强调的内容,用粗体来显示重点强调的内容,然而,这是没有必要的,如果是为了确定强调内容的显示方式,最好的方法就是使用CSS来 定义他们的表现。当你想要的只是视觉上的效果时,就不要使用强调了。而且如果你想要强调但是还觉得粗体或者斜体不视觉效果没那么好,特别是斜体对于中文来 说,那么你完全可以定义一些其他的比较醒目的样式达到强调的效果。
  例如:
  <p><em>强调</em> 的文本通常用斜体显示,
  然而, <strong>特别强调</strong> 的文本通常以粗体显示。</p>
   <table>、<td>、<th>、< caption >、 summary
  XHTML中的表格不应用来布局。然而如果是为了标记列表的数据,就应该使用表格 了。<th>为表格标题,属性summar为摘要,<caption>标签为首部说明,<thead>标签为表格头 部,<tbody>标签为表格主体内容,<tfoot>标签为表格尾部。
  其中还可以使用scope 可用于取代headers属性,标记含有表头信息的单元格,其中各数值的内容如下:
  row 指示当前单元格,为包含当前单元格的行提供相关的表头信息。
  col 指示当前单元格,为根据当前单元格指定的列提供相应的表头信息。
  rowgroup 指示当前单元格,为包含当前单元格的其余行组提供相关的表头信息。
  colgroup 指示当前单元格,为根据当前单元格指定的其余列组提供相应的表头信息。
  abbr 用于定义表头单元格中的缩写名,如果没有定义该属性,则将默认单元格内容为节略形式。
  例如:
  <table id=/"mytable/" cellspacing=/"0/" summary=/"The technical specifications of the Apple PowerMac G5 series/">
  <caption>Table 1: Power Mac G5 tech specs </caption>
  <tr>
  <th scope=/"col/" abbr=/"Configurations/" class=/"nobg/">Configurations</th>
  <th scope=/"col/" abbr=/"Dual 1.8/">Dual 1.8GHz</th>
  <th scope=/"col/" abbr=/"Dual 2/">Dual 2GHz</th>
  <th scope=/"col/" abbr=/"Dual 2.5/">Dual 2.5GHz</th>
  </tr>
  <tr>
  <th scope=/"row/" abbr=/"Model/" class=/"spec/">Model</th>
  <td>M9454LL/A</td>
  <td>M9455LL/A</td>
  <td>M9457LL/A</td>
  </tr>
  <tr>
  <th scope=/"row/" abbr=/"G5 Processor/" class=/"specalt/">G5 Processor</th>
  <td class=/"alt/">Dual 1.8GHz PowerPC G5</td>
  <td class=/"alt/">Dual 2GHz PowerPC G5</td>
  <td class=/"alt/">Dual 2.5GHz PowerPC G5</td>
  </tr>
  <tr>
  <th scope=/"row/" abbr=/"Frontside bus/" class=/"spec/">Frontside bus</th>
  <td>900MHz per processor</td>
  <td>1GHz per processor</td>
  <td>1.25GHz per processor</td>
  </tr>
  <tr>
  <th scope=/"row/" abbr=/"L2 Cache/" class=/"specalt/">Level2 Cache</th>
  <td class=/"alt/">512K per processor</td>
  <td class=/"alt/">512K per processor</td>
  <td class=/"alt/">512K per processor</td>
  </tr>
  </table>
   <dfn>
  <p><dfn title=/"Microsoft web browser/">Internet Explorer</dfn> is the most popular browser used underwater.</p>
   <ins>, <del>
  知道del,就不要再用<s>做删除线了,用del显然更具有语义化。而且del还带有cite和datetime来表明删除的原因以及删除的时间。ins是表示插入,也有这样的属性。
  例如:
  <p>It really was <ins cite=/"rarara.html/" datetime=/"20031024/">very</ins> good.</p>
   <code>
  表示是计算机代码。而默认样式为打字体。技术论坛和blog中经常遇到。
  例如:
  <code>p{margin:2px 0;}</code>
   <abbr>、<acronym>
  <abbr>标签是表示web页面上的简称,<acronym>标签 为取首字母缩写。(注:这里把简称和缩写分开而论,简称范围比缩写大,取首字母的缩写用<acronym>标签)Windows的IE6.0 以下的浏览器暂不支持<abbr>标签。 在IE里,你可以应用CSS给<acronym>但是不能应用给<abbr>标签,IE会为<acronym>标签 的title属性显示提示,但是会忽略<abbr>标签。
  例如:
  <abbr title=/"Cascading Style Sheets/">CSS</abbr>
  <acronym title=/"Cascading Style Sheets/">CSS</acronym>
   alt属性和title属性
  title属性用来为元素提供额外说明信息title属性可以用在除了base,basefont,head,html,meta,param,script和title之外的所有标签。但是并不是必须的。
  alt属性为不能显示图像、窗体或applets的用户代理(UA),指定替换文字。替换文字的语言由lang属性指定。
  <img src=/"/images/logo.gif/" width=/"90/" height=/"27/" alt=/"webjx.com/"/>
  <a href=/"http://www.baidu.com/" title=/"用Photoshop创建最佳黑白照片的方法/">用Photoshop创建最佳黑白照片的方法</a>

提高html页面显示速度

< TABLE BORDER="0" > < TR > < TD COLSPAN="2" >< !-- 顶端导航条的内容 -- >< /TD >< /TR > < TR > < TD ALIGN="LEFT" VALIGN="TOP" >< !-- 左边导航条的内容 -- >< /TD > <TD ALIGN="LEFT" VALIGN="TOP" >< !-- 页面内容区域 -- >< /TD > < /TR > < /TABLE > 
  修改后的布局代码如下所示: 
  < TABLE BORDER="0" WIDTH="100%" > < TR > < TD ALIGN="CENTER" VALIGN="TOP">< !-- 顶端导航条的内容 -- >< /TD > < /TR > < /TABLE > < TABLE BORDER="0"ALIGN="LEFT" > < TR > < TD ALIGN="LEFT" VALIGN="TOP" >< !-- 左边导航条的内容 -- ></TD > < /TR > < /TABLE > < TABLE BORDER="0" > < TR > < TD ALIGN="LEFT"VALIGN="TOP" >< !-- 页面内容区域 -- >< /TD > < /TR > < /TABLE >
  例如,原先使用下面的代码:
  Do while not objRS.EOF strOptionList = strOptionList & "< OPTIONVALUE=""" & objRS("ID") & _ """ >" & objRS("ProductName") objRS.MoveNextLoop Response.Write "< SELECT SIZE=""1"" >" & strOptionList & "< /SELECT >" 
  现在只需改动一行代码:
  Do while not objRS.EOF strOptionList = strOptionList & "< OPTIONVALUE=""" & objRS("ID") & _ """ >" & objRS("ProductName") & "< /OPTION >"objRS.MoveNext Loop Response.Write "< SELECT SIZE=""1"" >" & strOptionList &""
  如果原来使用的代码如下: 
  < UL > < LI >苹果 < LI >桔子 < LI >香蕉 < /UL >
  那么现在改用:
  < UL > < LI >苹果< /LI > < LI >桔子< /LI > < LI >香蕉< /LI > < /UL >
  经过这些改动之后,浏览器显示页面的速度将会更快。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值