当前位置:首页 > 软件开发 > dev
firefox

XHTML的目标,规则和细节

两个目的: 1,将页面的内容和形式清晰的分离开来 2,使页面内容更接近于xml 为什么要实现这两个目的,好多地方都有讲,不过,这里简单的讲两条
1,跟为什么asp.net要分层是一个道理,内容和形式分离后,一个符合xhtml规范的页面的外观可重覆设计而无需更改页面内容
2,跟xml靠近的原因,这个好多地方有讲,最重要的是,html固然能被ie解析,可他那过于宽松的形式,大量的形式标记,无助于表示语义,一句话,html是用来呈现的,可它却忘了数据的重要性,数据不光要呈现,而且最好容易理解,这一点恰恰是xml的长处,xml就是用来表示数据的

xhtml的版本标准有三个
xhtml 1.0 过渡版,这个比较宽松
xhtml 1.0 严格版,严格要求形式和内容分离
xhtml 1.0 框架版,加入了对frameset的支持

xhtml 1.0包含哪些标准呢?或者说,什么样的页面才是xhtml1.0规范页面呢?

1,页面开头必须包含一个正确的xml doctype声明
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en"
"http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">

<!doctype html public "-//w3c//dtd xhtml 1.0 strict//en"
"http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">
这个要注意,这个声明是告诉浏览器如何渲染页面的,想做个测试的话,你在dreamweaver中做两个页面,一个用html,一个用xhtml标准,内容是一个100%宽100%高的表格,你给表格应用上边框,在ie里查看,你会发现,html标准的,表格确实是100%高100%宽,但是xhtml的就不会,表格高度无法到达100%高,这说明,ie在渲染时,是会根据doctype声明有所区别的

2,根元素必须指出xhtml命名空间
通常是html这个<html xmlns="http://www.w3.org/1999/xhtml">
3,所有元素和属性名要小写
4,属性值必须用双引号括起
这一条是很多人容易忘记的,因为在html里,数值属性值,我们往往都不写双引号,像a标记的href,也可以不写
不过,vs.net的选项里,有选项可以让vs.net自动帮你产生属性值双引号,而且可以自动更改大小写,挺方便
5,每一个元素必须有结束标记,如果是空元素,则按xml规则来书写,就是说<img>要写成<img  />
6,标记不要交叉,这一点应该没问题吧,不过,ie才不管你交不交叉,它的容错能力倒是超强(不是纠错哦)
7,属性必须有值,以前我们写checkbox的属性,总是写<input type="checkbox" checked>这回不行了,得写成<input type="checkbox" checked="true" />
8,用id属性取代name属性,这点顺理成章吧,毕竟id更深入人心,特别是搞server side技术的,而且dhtml中,有许多涉及到id的方法了,真不知道干啥还要用name(不是指input类的哦,是指a,img等)
9,<script>及<style>标记的内容必须使用
<![cdata[
]]>括起
这一点也容易理解,要不,如果你<script>中有<>形式的字符,也会被浏览器当成xhtml标记来渲染了,但是,你可千万别以为真是直接用上面的标记括呀,你要这样括了,ie一定报错,因为ie虽然认识他们,可是javascript会当它们是代码呀,怎么办呢?正确的办法是加上javascript注释
/*<![cdata[*/
/*]]>*/
这样一来就行了,不过,我刚开始看到上面的方法,很怀疑,因为这样一来,ie咋解析/**/呢?原文说,"the cdata section is hidden from the javascript, but not from the browser that parses the page",就是说,虽然javascript注释掉它,并忽略它,但是浏览器仍然会解析它
当然,更好的办法是把script和style放到外部文件中去

其他的部分是我的建议
1,废除掉一些旧的标记,例如font,b,i,u等,基本上是那些用于修饰格式的标记
2,尽量使用div来布局而不是table,当然如果你不熟的话,用table也可以,不过,还是慢慢熟的好,至于原因,我想,div至少在用robert程序抓取时比table好解析多了吧
3,用样式来控制页面布局及格式,尽量不要用内容样式,要问为什么的话,你想想看,内联样式重用率低,而且太分散
4,选一个好的xhtml编辑器
一个好的编辑器有助于事半功倍的帮你编写xhtml标准的页面
vs.net的html设计器一向不是很好使,而且vs.net2003根本未提供xhtml支持,它仅支持标记自动小写,自动为属性加双引号,不支持自动改写空标记,更不支持验证是否符合xhtml
在这里建议大家用macromedia dreamweaver mx 8,它的确是这世界上最棒的html设计器了,它支持100%的xhtml特性,从创建到验证,特别是验证,可以让你在创建完后,验证是否有违犯xhtml规定的地方

一些细节
doctype开关
不同的doctype声明对于浏览器来说,在渲染处理上是不一样的,主要是像box的计算规则之类的处理上
这一点是很多人所不知道的,例如,ie6支持两种模式,一种是标准模式,另一种是宽松模式,如果是xhtml的页面,则会用标准模式处理,如果是普通html页面,则是用宽松模式来处理,所以,一个内容相同的页面,doctype不一样,出来的细节也有些差别

本文翻译和摘要了一篇来自由stephen walther发表于msdn上的文档,原文见http://msdn.microsoft.com/asp.net/reference/design/default.aspx?pull=/library/en-us/dnaspp/html/aspnetusstan.asp#aspnetusstan_topic2

 ↓相关文章:
© 2006-2008 All Rights Reserved