XHtml規則-Html轉換爲XHtml

XHTML規則

XHTML是XML得一個應用,它遵守XML得規範和要求。從技術角度上講。這些語法規則是由XML規範定義的。

XML文檔必須遵守的規則使得生成工具以解析文檔變得更容易。這些規則也使得XML更容易處理。規則很簡單,並且使用過HTML得人對於其中得一些規則應該比較熟悉。我們把XML得規則定義爲下列兩類:


 ∷XML語法規則,指的是定義了基本語法要求的規則。

∷XML文檔規則,指的是管理着基本文檔要求的規則。


∷XHTML語法規則

    XHTML需要遵守的許多語法規則,比HTML文檔需要遵守的規則嚴格很多。因此,下面所說的每個規則示例都伴隨有使用HTML語法的HTML示例和遵循每節中定義的規則的XHTML示例。


1.所有的標記都必須要有一個相應的結束標記

以前在HTML中,你可以打開許多標籤,例如<p>和<li>而不一定寫對應的</p>和</li>來關閉它們。但在XHTML中這是不合法的。XHTML要求有嚴謹的結構,所有標籤必須關閉。如果是單獨不成對的標籤,在標籤最後加一個"/"來關閉它。例如:

<br /><img height="80" alt="網頁設計師" src="../images/logo_w3cn_200x80.gif" width="200" />

2.所有標籤的元素和屬性的名字都必須使用小寫

與HTML不一樣,XHTML對大小寫是敏感的,<title>和<TITLE>是不同的標籤。XHTML要求所有的標籤和屬性的名字都必須使用小寫。例如:<BODY>必須寫成<body> 。大小寫夾雜也是不被認可的,通常dreamweaver自動生成的屬性名字"onMouseOver"也必須修改成"onmouseover"。


3.所有的XHTML標記都必須合理嵌套

同樣因爲XHTML要求有嚴謹的結構,因此所有的嵌套都必須按順序,以前我們這樣寫的代碼:
<p><b></p>/b>必須修改爲:<p><b></b>/p>
就是說,一層一層的嵌套必須是嚴格對稱。


4.所有的屬性必須用引號""括起來

在HTML中,你可以不需要給屬性值加引號,但是在XHTML中,它們必須被加引號。例如:

<height=80> 必須修改爲:<height="80">
特殊情況,你需要在屬性值裏使用雙引號,你可以用",單引號可以使用&apos;,例如:

<alt="say&apos;hello&apos;">

5.把所有<和&特殊符號用編碼表示

任何小於號(<),不是標籤的一部分,都必須被編碼爲&lt ;
任何大於號(>),不是標籤的一部分,都必須被編碼爲&gt ;
任何與號(&),不是實體的一部分的,都必須被編碼爲&amp;


6.給所有屬性賦一個值

XHTML規定所有屬性都必須有一個值,沒有值的就重複本身。例如:

<td nowrap>
<input type="checkbox" name="shirt" value="medium" checked>
必須修改爲:

<td nowrap="nowrap">
<input type="checkbox" name="shirt" value="medium" checked="checked">

7.不要在註釋內容中使“- -”

“--”只能發生在XHTML註釋的開頭和結束,也就是說,在內容中它們不再有效。例如下面的代碼是無效的:

<!--這裏是註釋-----------這裏是註釋-->
用等號或者空格替換內部的虛線。

<!--這裏是註釋= = = = = = = = = = = =這裏是註釋-->

以上這些規範有的看上去比較奇怪,但這一切都是爲了使我們的代碼有一個統一、唯一的標準,便於以識別。

∷XHTML文檔規則
    這裏有爲數不多的文檔規則控制着良好構成的XML文檔。我們還定義了一些可選擇規則並推薦大家遵守,但這不是必須的。

 

 

 

 


把HTML轉換成XHTML


1.手工轉換文檔

如果你更新數量不太多的文檔,並且自己又很不願意有一些XHTML實踐經驗,那麼你會選擇手工把HTML頁面轉換成XHTML。現在有非常出色的免費工具(HTML Tidy,將在下面具體討論)可以幫你完成。但是,理解工具做了什麼很重要,這樣才能使用其中的自定義選項。


向後兼容性


XHTML與老式瀏覽器保持向後兼容。你應該記住XHTML使用HTML的詞彙表,只有語法管理是阻止XHTML與老式瀏覽器兼容的實際障礙。幸運的是,XML語法與SGML(因此還有HTML)非常接近,因此語法方面的差別並不大。


在上面,已經講解了XHTML文檔必須遵守的所有規範,其中大多數已經由HTML進行了定義。額外的一些情況如所有的元素都必須關閉以及遵守空元素規則,是新增的

● 在使用XML的空元素語法時,在後面的斜線(/)之前要加一個空格,如<br />。
 

● 大多數老式瀏覽器會把XML的聲明

    <?xml version=”1.o” encoding=”HTF-8” standlone=”no”?>

作爲內容顯示出來,因此最好是省去將被老式瀏覽器看到的XHTML文檔。如果你從文檔中省去了XML聲明,則該文檔只能使用UTF-8或者UTF-16字符編碼。

 

● 使用外部樣式或者腳本文檔,而不要把他們嵌入到你的XHTML文檔的頭部。在XHML代碼之前,Web開發者可以使用HTML註釋把腳本和樣式單語句隱藏起來不被老式瀏覽器所見。XHTML使用XML CDATA節來標識內部腳本和樣式單語法。

 老式和新式的處理器很可能有衝突。如果你不使用外部腳本或者樣式單,則應保證內部語句不要包含<.&.}]>或者--。

 

● 要在屬性值或中加入折行或者多個空白符。許多XML開發者使用折行來幫助提供文檔的可讀性,但是瀏覽器對空白的處理切並不統一,並且在顯示XHTML文檔時多個空白符可能會引起問題。如果要使用空白符來提高可讀性,那麼要保證你只在元素之間使用這些空白符。

 

● 引用以英鎊符(#value)開始的段識別符時要使用name和id屬性。Name屬性最初用於引用命名的錨接點(anchor);但是HTML4已經不在贊成使用此屬性,並且引入了id屬性代替它來唯一的標識給定的元素。爲了保證將來的兼容性,你希望使用id屬性;但是,因爲許多目前的瀏覽器以及老式瀏覽器並不支持此屬性,所以你也要使用name屬性。例如:

      <a name=”one” id=”one”>…</a>

 

● 同樣,爲了保持向前和向後的兼容性,還要同時使用lang和xml:lang屬性來定義一個給定元素的語言。xml:lang屬性比lang屬性優先。

 

規則

    作爲XML的一個應用,XHTML要求遵守XML的語法要求。詳細規則在前面已經說過。

閉合所有元素;

使用正確的空元素語法;

所有的屬性值都必須用引號;

爲所有屬性分配值;

元素和屬性名要小寫。XHTML區分大小寫;

元素要正確嵌套;

包含一個DOCTYPE聲明

如果你堅持使用XHTML1的DTD之一,就不能使用HTML4的DTD引用。當你把自己的文檔從HTML轉換到XHTML時,要保證使用的是正確的DOCTYPE聲明。


XHTML提供了三種dtd聲明可供選擇:

過渡的(transitional):

要求非常寬鬆的dtd,它允許你繼續使用html4.01的標識(但是要符合xhtml的寫法)。完整代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">

嚴格的(strict):
要求嚴格的dtd,你不能使用任何表現層的標識和屬性,例如<br>。完整代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN"
"http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd">

框架的(frameset):
專門針對框架頁面設計使用的dtd,如果你的頁面中包含有框架,需要採用這種dtd。完整代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 FRAMESET//EN" http://www.w3.org/tr/xhtml1/dtd/xhtml1-frameset.dtd">

添加XHTML名字空間:
    XHTML使用XML名字空間來幫助唯一地標識元素和屬性集。這種辦法對於計劃混和(嵌套)使用其他XML詞彙表地時候尤其會帶來方便。根據XHTML技術規範,所有的XHTML文檔都必須使用默認的XHTML技術規範,所有的XHTML文檔都必須使用默認的XHTML名字空間(xmlns="http://www.w3.org/1999/xhtml")。這個名字空間是要求使用的,並且必須定義在html起始標誌中。

綜合應用

 

下面的清單不是一個良好構成的XHTML文檔,我們將把它轉換成良好構成的XHTML文檔。


    不嚴謹的HTML文檔

<HTML>

<HEAD>

<TITLE>Sloppy HTML</TITLE>

</HEAD>

<BODY>

<H1>Element Rules</H1>

<P><FONT COLOR=RED>Elements provide the structure that holds your document together.</FONT>

<BR>

<OL COMPACT>

<LI>Close all elements.

<LI>Empty elements should follow empty-element syntax,and besure to add the white space for backward compatibility.

<LI>Convert all stand-alone attributes to attributes with values.

<LI>Add quotation marks to all attribute values.

<LI>Convert all uppercase element and cttribute names to lowercase.

<LI>Use the appropriate DOCTYPE declaration.

<LI>Add the XHTML namespace to the html start tag.

<LI>Make sure you comply with any backward-compatible steps defined in the section "Backward Compatibility. "

</OL>

</BODY>

</HTML>

 

按照下列步驟把上述文檔更改爲具有良好的構成:

 

1.關閉所有元素。注意p元素以及列表項元素(li)都沒有關閉標誌,因此應該添加標識關閉的p和li標誌。

 <P><FONT COLOR=RED>Elements provide the structure that holds your document together.</FONT></P>

<BR>

<OL COMPACT>

<LI>Close all elements.</LI>

<LI>Empty elements should follow empty-element syntax,and besure to add the white space for backward compatibility. </LI>

<LI>Convert all stand-alone attributes to attributes with values. </LI>

<LI>Add quotation marks to all attribute values. </LI>

<LI>Convert all uppercase element and cttribute names to lowercase. </LI>

<LI>Use the appropriate DOCTYPE declaration. </LI>

<LI>Add the XHTML namespace to the html start tag. </LI>

<LI>Make sure you comply with any backward-compatible steps defined in the section "Backward Compatibility. "</LI>

</OL>

 

2.空元素應該最手空元素語法,並且要保證加入必要的空格以保持向後兼容性。BR元素是上述文檔中唯一的空元素,因此應該把它更改成<BR />。

 

3.把所有獨立的屬性轉換成帶有值的屬性。把COMPACT更改爲COMPACT=COMPACT。

 

4.在所有屬性值上加引號。

<P><FONT COLOR="RED">Elements provide the structure that holds your document together.</FONT></P>

<BR>

<OL COMPACT="COMPACT">

 

5.把所有大寫元素和屬性名(以及屬性值)都轉換爲小寫。

<html>

<head>

<title>Sloppy HTML</title>

</head>

<body>

<h1> Element Rules</h1>

<p><font color="red"> Elements provide the structure that holds your document together.</font></p>

<br />

<ol compact="compact">

<li> Close all elements.</li>

<li> Empty elements should follow empty-element syntax,and besure to add the white space for backward compatibility.</li>

<li> Convert all stand-alone attributes to attributes with values.</li>……

 

6.使用正確的DOCTYPE聲明。我們將使用過渡型(Transitional)DTD:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">

 

7.把XHTML名字空間添加到html起始標誌中。

<html xmlns=http://www.w3.org/1999/xhtml>

 

 


最後得到的代碼如下:


簡潔的XHTML文檔

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">

<html xmlns=http://www.w3.org/1999/xhtml>

<head>

<title>Sloppy HTML</title>

</head>

<body>

<h1> Element Rules</h1>

<p><font color="red"> Elements provide the structure that holds your document together.</font></p>

<br />

<ol compact="compact">

<li> Close all elements.</li>

<li> Empty elements should follow empty-element syntax,and besure to add the white space for backward compatibility.</li>

<li> Convert all stand-alone attributes to attributes with

values.</li>

<li> Add quotation marks to all attribute values.</li>

<li>Convert all uppercase element and cttribute names to lowercase.</li>

<li>Use the appropriate DOCTYPE declaration.</li>

<li>Add the XHTML namespace to the html start tag.</li>

<li>Make sure you comply with any backward-compatible steps defined in the section "Backward Compatibility."</li>

<ol>

</body>

</html> 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章