您現(xiàn)在的位置： 365建站網(wǎng) > 365文章 > XHTML的目標(biāo),規(guī)則和細(xì)節(jié)

XHTML的目標(biāo),規(guī)則和細(xì)節(jié)

文章來源：365jz.com 點擊數(shù)：214 更新時間：2008-07-26 19:57 參與評論

兩個目的:
1,將頁面的內(nèi)容和形式清晰的分離開來
2,使頁面內(nèi)容更接近于XML

為什么要實現(xiàn)這兩個目的,好多地方都有講,不過,這里簡單的講兩條
1,跟為什么ASP.NET要分層是一個道理,內(nèi)容和形式分離后,一個符合XHTML規(guī)范的頁面的外觀可重覆設(shè)計而無需更改頁面內(nèi)容
2,跟XML靠近的原因,這個好多地方有講,最重要的是,HTML固然能被IE解析,可他那過于寬松的形式,大量的形式標(biāo)記,無助于表示語義,一句話,HTML是用來呈現(xiàn)的,可它卻忘了數(shù)據(jù)的重要性,數(shù)據(jù)不光要呈現(xiàn),而且最好容易理解,這一點恰恰是XML的長處,XML就是用來表示數(shù)據(jù)的

XHTML的版本標(biāo)準(zhǔn)有三個
XHTML 1.0 過渡版,這個比較寬松
XHTML 1.0 嚴(yán)格版,嚴(yán)格要求形式和內(nèi)容分離
XHTML 1.0 框架版,加入了對FRAMESET的支持

XHTML 1.0包含哪些標(biāo)準(zhǔn)呢?或者說,什么樣的頁面才是XHTML1.0規(guī)范頁面呢?

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標(biāo)準(zhǔn),內(nèi)容是一個100%寬100%高的表格,你給表格應(yīng)用上邊框,在IE里查看,你會發(fā)現(xiàn),HTML標(biāo)準(zhǔn)的,表格確實是100%高100%寬,但是XHTML的就不會,表格高度無法到達100%高,這說明,IE在渲染時,是會根據(jù)DOCTYPE聲明有所區(qū)別的

2,根元素必須指出XHTML命名空間
通常是HTML這個<html xmlns="http://www.w3.org/1999/xhtml">
3,所有元素和屬性名要小寫
4,屬性值必須用雙引號括起
這一條是很多人容易忘記的,因為在HTML里,數(shù)值屬性值,我們往往都不寫雙引號,像A標(biāo)記的HREF,也可以不寫
不過,VS.NET的選項里,有選項可以讓VS.NET自動幫你產(chǎn)生屬性值雙引號,而且可以自動更改大小寫,挺方便
5,每一個元素必須有結(jié)束標(biāo)記,如果是空元素,則按XML規(guī)則來書寫,就是說<IMG>要寫成<IMG />
6,標(biāo)記不要交叉,這一點應(yīng)該沒問題吧,不過,IE才不管你交不交叉,它的容錯能力倒是超強(不是糾錯哦)
7,屬性必須有值,以前我們寫CHECKBOX的屬性,總是寫<input type="checkbox" checked>這回不行了,得寫成<input type="checkbox" checked="true" />
8,用ID屬性取代NAME屬性,這點順理成章吧,畢竟ID更深入人心,特別是搞SERVER SIDE技術(shù)的,而且DHTML中,有許多涉及到ID的方法了,真不知道干啥還要用NAME(不是指INPUT類的哦,是指A,IMG等)
9,<script>及<style>標(biāo)記的內(nèi)容必須使用
<![CDATA[
]]>括起
這一點也容易理解,要不,如果你<SCRIPT>中有<>形式的字符,也會被瀏覽器當(dāng)成XHTML標(biāo)記來渲染了,但是,你可千萬別以為真是直接用上面的標(biāo)記括呀,你要這樣括了,IE一定報錯,因為IE雖然認(rèn)識他們,可是JAVASCRIPT會當(dāng)它們是代碼呀,怎么辦呢?正確的辦法是加上JAVASCRIPT注釋
/*<![CDATA[*/
/*]]>*/
這樣一來就行了,不過,我剛開始看到上面的方法,很懷疑,因為這樣一來,IE咋解析/**/呢?原文說,"the CDATA section is hidden from the JavaScript, but not from the browser that parses the page",就是說,雖然JAVASCRIPT注釋掉它,并忽略它,但是瀏覽器仍然會解析它
當(dāng)然,更好的辦法是把SCRIPT和STYLE放到外部文件中去

其他的部分是我的建議
1,廢除掉一些舊的標(biāo)記,例如font,b,i,u等,基本上是那些用于修飾格式的標(biāo)記
2,盡量使用DIV來布局而不是TABLE,當(dāng)然如果你不熟的話,用TABLE也可以,不過,還是慢慢熟的好,至于原因,我想,DIV至少在用ROBERT程序抓取時比TABLE好解析多了吧
3,用樣式來控制頁面布局及格式,盡量不要用內(nèi)容樣式,要問為什么的話,你想想看,內(nèi)聯(lián)樣式重用率低,而且太分散
4,選一個好的XHTML編輯器
一個好的編輯器有助于事半功倍的幫你編寫XHTML標(biāo)準(zhǔn)的頁面
VS.NET的HTML設(shè)計器一向不是很好使,而且VS.NET2003根本未提供XHTML支持,它僅支持標(biāo)記自動小寫,自動為屬性加雙引號,不支持自動改寫空標(biāo)記,更不支持驗證是否符合XHTML
在這里建議大家用MACROMEDIA DREAMWEAVER MX 8,它的確是這世界上最棒的HTML設(shè)計器了,它支持100%的XHTML特性,從創(chuàng)建到驗證,特別是驗證,可以讓你在創(chuàng)建完后,驗證是否有違犯XHTML規(guī)定的地方

一些細(xì)節(jié)
DoCTYPE開關(guān)
不同的DOCTYPE聲明對于瀏覽器來說,在渲染處理上是不一樣的,主要是像BOX的計算規(guī)則之類的處理上
這一點是很多人所不知道的,例如,IE6支持兩種模式,一種是標(biāo)準(zhǔn)模式,另一種是寬松模式,如果是XHTML的頁面,則會用標(biāo)準(zhǔn)模式處理,如果是普通HTML頁面,則是用寬松模式來處理,所以,一個內(nèi)容相同的頁面,DOCTYPE不一樣,出來的細(xì)節(jié)也有些差別

本文翻譯和摘要了一篇來自由Stephen Walther發(fā)表于MSDN上的文檔,原文見http://msdn.microsoft.com/asp.net/reference/design/default.aspx?pull=/library/en-us/dnaspp/html/aspnetusstan.asp#aspnetusstan_topic2