DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> XHTML頭部Doctype聲明必不可少!
XHTML頭部Doctype聲明必不可少!
編輯:CSS詳解     
 HTML遵循一定的規則。這些規則包含在一個文檔類型定義(Document Type Definition)文件中,或者如大家所知的DTD。DTD是一個XML文檔,解釋了哪些標簽、屬性或值對於HTML的一個特定類型是有效的。每一個Html版本,都有一個對應的DTD。現在你可能會問:“所有這些和CSS又有什麼關系呢?”

  如果想讓網頁中的所有內容都在網頁浏覽器上正確、一致地顯示,就得告訴網頁浏覽器你正使用HTML或者XHTML的哪個版本,包括一個網頁開頭處的文檔類型聲明(doctype declaration)是什麼意思。這個文檔類型聲明是在HTML文件的第一行,不僅定義你正使用的HTML版本(比如Html 4.01 Transitional),而且指向網頁中適當的DTD文件。當鍵錯文檔聲明時,你會使大部分浏覽器進入一個叫怪異模式(Quirks Mode)(譯注1)的警告狀態。

  怪異模式(Quirks Mode)是浏覽器制造商為使他們的軟件運行起來就像大約1999年(Netscape 4和Internet Explorer 5時代)時的浏覽器所采用的方法。如果一個現代浏覽器遇到一張沒有正確文檔類型的網頁,它就會以為:“嗯,這張網頁一定是很早很早以前用HTML編輯器寫的。我得假裝自己是一個真正很舊的浏覽器來顯示網頁,就像那些bug重重的舊浏覽器所顯示的那樣。”這就是為什麼當沒有一個正確的文檔類型時,你用CSS進行樣式設置的可愛網頁,可能看起來並不像它根據當前的標准所應該顯示的樣子。當你在浏覽器上檢測時,無意中用怪異模式(Quirks Mode)浏覽到你的網頁,你可能會停止嘗試去修正與不正確的文檔類型有關、而不是不正當使用Html或者CSS所引起的顯示問題。

  注意:想了解更多關於怪異模式的相關信息,請訪問www.quirksmode.org/index. html?/CSS/quirksmode.Html 和 http://hsivonen.iki.fi/doctype/

  所幸的是,獲得正確的文檔類型很簡單。你所要知道的就是正在使用哪個HTML版本。最可能的是,你已經用HTML 4創建了網頁。你甚至可能已經開始給你的網站使用XHtml(見第5頁)。

  目前最流行的HTML和XHTML的版本是HTML 4.01 Transitional和XHTML 1.0 Transitional。這些HTML類型仍然讓你使用展示型的標簽,如標簽,在這方面還提供一個從舊版HTML到新版HTML的過渡:更嚴格的HTML和XHtml

  標簽。雖然最好不要使用這些標簽,但它們在Transitional版中仍然起作用,因此你可以根據自己的情況,逐步淘汰這些舊式標簽。在嚴格版的HTML和XHtml中,有些舊式標簽根本不起作用。

  注意:一般來說,HTML和XHtml的嚴格版均不接受僅使網頁展現效果好看的標簽和屬性,如標簽和一個段落的置中屬性。它們也不接受一些曾經流行的屬性,比如一個鏈接的目標屬性——讓你在一個新窗口中打開鏈接。

  如果你正使用Html 4.01 Transitional,就要在創建的每張網頁的開頭處鍵入下列文檔類型聲明:

  XHtml 1.0 Transitional的文檔聲明也與此相似,但它指向一個不同的DTD。給開始的標簽添加一些代碼來識別網頁所用的語言,這也是個好主意,就像這樣:

  
  注意:如果你正在給網頁使用框架(frame),那麼你就要給框架設置使用一個文檔類型。請見W3C網站中正確的文檔類型列表清單:www.w3.org/QA/ 2002/04/valid-dtd-list.Html。

  如果這整個討論正讓你頭疼且累得合不上眼,那麼只要確保使用以上所列的正確的文檔類型,並且始終將它放在HTML文件的第一行(恰好在標簽的前面)就行了。如果你想要一個基本的模板,便於在創建HTML或者XHtml網頁時使用,請訪問本書的網站:www.sawMac.com/CSS/。事實上,使用正確文檔類型來創建一個空白的HTML網頁並保存在你的計算機上,是一個好主意。這樣每當你需要創建一個新網頁的時候就從它那裡進行拷貝。使用一個Html檢驗器,就像在第22頁方框中所述的那樣,也是確保你正確鍵入文檔類型聲明的一個好辦法。

  注意:大部分可視的網頁工具如Dreamweaver、GoLive和FrontPage,在創建一張新網頁時都會自動添加一個文檔類型聲明。許多智能型的Html文本編輯器都有添加文檔類型的快捷方式。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved