網頁設計DIV+CSS——第1 天:選擇什麼樣的DOCTYPE

2021-11-07 01:46:47

大家好！這個系列文章是按阿捷自己制作這個站點的過程編寫的。之前阿捷也一直沒有制作過一個真正符合 web 标準的網站。

現在邊參考國外資料邊制作，同時把過程中的心得和經驗記錄下來，希望對大家有點幫助。好了，讓我們開始吧

第一天

開始制作符合标準的站點，第一件事情就是聲明符合自己需要的 doctype。

打開一些符合标準的站點，例如著名 web 設計軟體開發商 macromedia，設計大師 zeldman 的個人網站，會發現同樣的代碼。

而另一些符合标準的站點(例如 k10k.net)的代碼則如下：

<!doctype html public "-//w3c//dtd xhtml 1.0 frameset//en"

那麼這些代碼有什麼含義？一定要放置嗎？

什麼是doctype

上面這些代碼我們稱做 doctype 聲明。doctype 是 document type(文檔類型)的簡寫，用來說明你用的 xhtml 或者 html 是什麼版本。

其中的 dtd(例如上例中的 xhtml1-transitional.dtd)叫文檔類型定義，裡面包含了文檔的規則，浏覽器就根據你定義的 dtd來解釋你頁面的辨別，并展現出來。

要建立符合标準的網頁，doctype 聲明是必不可少的關鍵組成部分；除非你的 xhtml 确定了一個正确的 doctype，否則你的辨別和 css 都不會生效。

xhtml 1.0 提供了三種 dtd聲明可供選擇：

1 過渡的(transitional):要求非常寬松的 dtd，它允許你繼續使用 html4.01 的辨別(但是要符合 xhtml 的寫法)。完

整代碼如下：

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en"

2嚴格的(strict):要求嚴格的 dtd，你不能使用任何表現層的辨別和屬性，例如<br>。完整代碼如下：

3 架構的(frameset):專門針對架構頁面設計使用的 dtd，如果你的頁面中包含有架構，需要采用這種 dtd。完整代碼

如下：

我們選擇什麼樣的doctype

理想情況當然是嚴格的 dtd，但對于我們大多數剛接觸 web 标準的設計師來說，過渡的 dtd(xhtml 1.0 transitional)是目前理想選擇(包括本站，使用的也是過渡型 dtd)。因為這種 dtd 還允許我們使用表現層的辨別、元素和屬性，也比較容易通過w3c 的代碼校驗。

注：上面說的"表現層的辨別、屬性"是指那些純粹用來控制表現的 tag，例如用于排版的表格、背景顔色辨別等。在 xhtml中辨別是用來表示結構的，而不是用來實作表現形式，我們過渡的目的是最終實作資料和表現相分離。

打個比方：人體模特換衣服。模特就好比資料，衣服則是表現形式，模特和衣服是分離的，這樣你就可以随意換衣服。而原

來 html4 中，資料和表現是混雜在一起的，要一次性換個表現形式非常困難。呵呵，有點抽象了，這個概念需要我們在應用過程中逐漸領會。

補充

doctype 聲明必須放在每一個 xhtml文檔最頂部，在所有代碼和辨別之上。

繼續閱讀