W3C标准以及XHTML和HTML

所属分类: 网页制作 / CSS 阅读数: 966
收藏 0 赞 0 分享

W3C ( World Wide Web Consortium ) 是一个致力于 W3 (World Wide Web) 标准化的组织,成立于1994年11月,目前(2007年5月)已经拥有441个会员,他们参与制作了以下与 W3 相关的标准. 什么是W3C?
W3C ( World Wide Web Consortium ) 是一个致力于 W3 (World Wide Web) 标准化的组织,成立于1994年11月,目前(2007年5月)已经拥有441个会员,他们参与制作了以下与 W3 相关的标准:
CSS CGI DOM HTML RDF SVG SOAP SMIL SRGS SSML VoiceXML WSDL XACML XHTML XML XML Events XForms XML Information Set XML Schema XPath XQuery XSLT
W3C 标准使全球的网页设计人员和浏览器制造商之间有了一个共同的标准,遵守这个标准的网页,在所有遵守 W3C 标准的浏览器上都可以获得一致的表现,由于世界上主流的浏览器(包括 IE6 ),目前都遵守 W3C 规范,所以,如果您的网站是基于 W3C 标准建立的,您可以完全不必担心浏览器兼容问题。 在网站建设中会最常使用到那些标准?
网站建设中最常用到 W3C 标准有三个 CSS, HTML, XHTML。其中 HTML 和 XHTML 用来提供内容,CSS 用来对内容进行修饰。现今,HTML CSS 或者 XHTML CSS 已经成为最有效的网页表现形式,这种表现形式的本质是,将内容同修饰分开,这样便于创作者在更新内容的时候,不必关心修饰,而更新修饰的时候,不必理会内容。
浏览器在对网页进行解析的时候,必须参照相应的标准,现代的浏览器会使用不同的标准解析网页内容,因为网页的置标语言有 HTML 和 XHTML 之分,我们在将网页送给浏览器解析之前,必须告诉它我们用的是 HTML 还是 XHTML,这就出现了 DOCTYPE 的概念,DOCTYPE 放在网页的最前面,它有多种定义形式,以下为 XHTML STRICT DOCTYPE 的定义,该定义告诉浏览器,接下来的 HTML 文档使用 XHTML 1.0 作为置标语言,使用 strict 规范进行解析。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
六种最常见的 DOCTYPE 定义
分别有三种 HTML DOCTYPE 和三种 XHTML DOCTYPE 构成了六种最常用的 DOCTYPE 定义,它们各有不同的侧重点,需要注意的是,其中的一些松散定义的目的是保持当前网站中的历史遗留(Legacy)网页同现代浏览器的兼容,采用松散定义的网页虽然在现代浏览器中仍能获得理想的表现,是因为浏览器进行了大量的容错处理,尽可能正确理解那些不和标准的网页代码,所以,如果您想从零开始进行网站建设,使用最严格的 DOCTYPE 可以保证您的网站将来不会出现兼容问题,因为浏览器对松散定义的网页的支持,将来未必能获得保证。
XHTML 1.0 Strict
XHTML STRICT CSS 是目前公认最严格,最有前途的标准,使用该标准,可以保证您的网页拥有干净的置标代码,稳定的兼容性能和最广泛的浏览器支持,我们在后面的 SEO 部分中还会提到,这种标准的网页在 SEO 中也会获得好的表现。它的定义为:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional
正象 Transitional 这个意思所表明的那样,该标准是一种过度标准,旨在保持网站中历史遗留网页的兼容性,目前,该标准下的网页在各大浏览器中基本可以获得一致的表现,但将来是否会被继续支持却没有保证,另外,同样一个网页,使用该 DOCTYPE 解析的时候,显示正常,但改用 XHTML 1.0 Strict DOCTYPE 的时候,往往被解析的一塌糊涂,这说明 XHTML 1.0 Transitional 标准容许大量错误或不规范的代码存在,为您的网站留下隐患。它的定义为:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset
当您需要使用 Frame 将您的页面划分成几个窗口的时候,需要使用本标准,但 Frame 是一种过时的技术,它最大的弱点在于不被搜索引擎支持,除非您有十分充足的理由,否则我们不建议您使用 Frame。它的定义为:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
HTML Strict
这种定义和 XHTML STRICT 一样,只是用 HTML 代替 XHTML。它的定义为:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML Transitional
和 HTML 一样,只是用 HTML 代替 XHTML。它的定义为:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML Frameset
和 XHTML Frameset 一样,只是用 HTML 代替 XHTML。它的定义为:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
#p#
W3C ( World Wide Web Consortium ) 是一个致力于 W3 (World Wide Web) 标准化的组织,成立于1994年11月,目前(2007年5月)已经拥有441个会员,他们参与制作了以下与 W3 相关的标准. XHTML 和 HTML 有那些区别
使用 XHTML 并非想象中的那么难,事实上,XHTML 和 HTML 的区别并不大,这期间并不存在很高的学习曲线,您完全可以在很短的时间内掌握 XHTML 并最终取代 HTML。以下是二者主要的区别:
XHTML 中的元素之间必须按次序正确嵌套
在 HTML 中
<a href=''><b>Linka></b>
虽然不规范,但浏览器都可以正确解析,在 XHML,您必须严格这样写

<a href=''><b>Link</b>a>
XHTML 中的元素必须包含结束标志
在 HTML 中,您可以这样写

<p>This is paragraph one
<p>This is paragraph two
或者这样写

<img src='...'><br>
在 XHML,您必须严格这样写

This is paragraph one

This is paragraph two

<img src='...'>

XHTML 必须使用小写
在 HTML 中,您可以这样写

<IMG SRC='...'><BR>
在 XHTML 中,您必须这样写

<img src='...'><br>
XHTML 文档必须有根 Element
您必须保持文档的严密结构。
XHTML 元素的属性必须使用引号引起来
在 HTML 中,您可以这样写
<table width=100%>
在 XHML,您必须严格这样写

<table width="100%"> 我们为什么建议使用 XHTML 替代 HTML
XHTML 简而言之,就是拥有 XML 规范的 HTML,将 XML 引入 HTML 的目的是改变 HTML 代码不够严格的问题,在我们的网络世界,到处充斥着劣质的 HTML 代码,这些代码的正确显示,取决于浏览器的容错能力,而我们对此是没有保障的。而 XML 要求您的内容必须严格按照规范进行置标,只有这样,我们才能获得结构严谨的文档,结构严谨的文档才能在各种浏览器中获得准确一致的表现,包括各种手持设备上的浏览器,我们知道,对手持设备而言,它们的浏览器没有那么强的处理能力来纠正 HTML 代码中的错误。同样, XHTML 完全向后兼容。
更多精彩内容其他人还在看

CSS配合JavaScript做酷的动态页面效果

  利用CSS配合JavaScript的可以做很多更酷的动态页面效果,在本教程的最后给大家简单介绍一下CSS配合JS的应用。首先,要搞清楚事件和动作的概念。在客户端脚本中,JavaScript 通过对事件进行响应来获得与用户的交互。例如,当用户单击一个按钮或者在某段文字上移动鼠标
收藏 0 赞 0 分享

WEB标准,Web前端开发工程师必备技术列表

  想要打造并拥有一流的Web产品开发团队,在团队成员基础能力上一定要下功夫。对于Web前端产品开发来说,仅仅掌握Web1.0时代简单的"网页套接"是完全不够的。我结合自己的团队配备,特此罗列了Web前端产品工程师所涉及的技能列表如下:   通过许多实际项目,
收藏 0 赞 0 分享

用CSS制作Alpha滤镜测试板

alpha滤镜给制作网页特效提供了较大的创作空间,但由于它控制参数较多,在实际应用时,为了确定一组合适的参数值,不得不反复调整修改,在编辑窗口和预览窗口来回倒腾,甚是麻烦,本文介绍了一种简单的方法。制作一个“Alpha滤镜参数测试板”,在测试板上输入参数
收藏 0 赞 0 分享

非常流行的所谓的气泡窗口

普通的Alt无法自定义风格,而Sweet Titles通过JS脚本与CSS的集合.自定义了这种伪Alt风格. 前一段时间非常流行的,就所谓的气泡窗口(鼠标移到链接处出现的). 我们这里实现的用的是Sweet Titles的插件.显示效果完全由CSS控制.. 先下载Sweet Ti
收藏 0 赞 0 分享

CSS教程:li和ul标签用法举例

LI代码的格式化: A).运用CSS格式化列表符: ul li{ list-style-type:none; } B).如果你想将列表符换成图像,则: ul li{ list-style-type:none; list-style-image: url(/blog/images/
收藏 0 赞 0 分享

CSS教程:CSS中的定位(position)

  使用CSS来定位页面内层的位置,一直是比较难以掌握的事情,很多时候,往往被绝对定位的元素,总是以浏览器的左上角为坐标原点,此时,如果浏览器的大小改变,被定义的层就会偏离设计想要的位置,让人很挠头。   其实,要想控制好层的绝对定位,只要理解CSS中关于定位
收藏 0 赞 0 分享

CSS教程:盒模型(BOX Model)

  如果想熟练掌握DIV和CSS的布局方法,首先要对盒模型有足够的了解。每个HTML元素都可以看作一个装了东西的盒子,盒子里面的内容到盒子的边框之间的距离即填充(padding),盒子本身有边框(border),而盒子边框外和其他盒子之间,还有边界(margin),如图1所示。
收藏 0 赞 0 分享

无延迟翻滚的图形与CSS混合风格按钮

  在一个具有图形背景的按钮中添加CSS风格的文本,这种建立按钮的方法结合了具有CSS翻滚(CSS rollover)标记的开发速度和效率,从而有效地提高按钮外表图像的三维效果。   相比于常规的图形按钮,这些图形/CSS混合按钮可易于建立和载入,因为你只需要为空白按钮外面
收藏 0 赞 0 分享

css里expression实现界面对象的批量控制

用过css样式我们就知道, 可以定义一批对象的class属性来指定同一个样式来统一界面. 但如何统一同类型的对象的事件? 比如:界面有无数个 <img src="**.jpg"> 如何实现鼠标经过此图片, 图片的src变成是**_over.jpg?
收藏 0 赞 0 分享

CSS教程:水平对齐(text-align)

  水平对齐(text-align),用以设定元素内文本的水平对齐方式。   1.语法   text-align具体参数如下: 语法:text-align:left|right|center|justify 说明:设定元素内文本的水平对齐方式。 参数:left:左
收藏 0 赞 0 分享
查看更多