我們中一些人已經陷在了一個壞習慣中，當我們僅僅需要一個大號字的文本時使用h1，或者在我們需要在前面加一個圓點符號時使用 li。就像我們在前面的章節(jié)討論過的，瀏覽器一直都習慣于將設計屬性強加于 HTML 元素之上。我們都一直習慣于認為，h1 意味著大號字，而li意味著圓點，或者 blockquote 意味著文本縮進。我們中的大多數人還在使用結構化元素模擬表現(xiàn)效果的方式來胡亂地寫作 HTML。

同樣地，假如設計師希望所有的標題使用相同的字號，她會將所有的標題設置為 h1，即使這么做毫無結構化語義可言。

這是主標題，在我將文本按照提綱格式組織的情況下。
這不是主標題，但是我希望它與上面的標題使用一樣的字體，但是我不知該如何使用CSS。
這根本不是一個標題。但是我非常希望頁面中的文字使用相同的字體，以達到我希望的，
如果我了解CSS，就可以在不打亂文檔結構的情況下達到這個設計。

我們必須把我們的小把戲放到一邊，然后開始根據元素的語義來使用它們，而不是根據它們看上去的樣子。實際上，h1可以成為你希望的任何樣子。通過 CSS，h1 可以成為非粗體的小號的羅馬字體，而 p 文本可以成為粗體的大號字，li 也可以沒有圓點（你或者可以使用小貓小狗或者公司標志的 PNG,GIF 或者 JPEG 圖片取而代之）等等。

從今天開始，我們將要使用 CSS 來決定元素的外觀。我們甚至可以根據元素在頁面中或者在站點中所在的位置來改變它們的外觀。CSS 可以將表現(xiàn)從結構中徹底抽離，并且允許你按照你喜歡的樣式來格式化任何元素。

h1, h2, h3, h4, h5, h6 {
	font-family: georgia, palatino, "New Century Schoolbook",
	times, serif;
	font-weight: normal;
	font-size: 2em;
	margin-top: 1em;
	margin-bottom: 0;
	}

你為什么要這么做呢？這么做的目的是為了在圖形瀏覽器中獲得品牌化的外觀和感覺的同時，在文本瀏覽器、無線設備、HTML 格式的電子郵件中，文檔的結構得到保留。

我們并不想在關于 XHTML 的章節(jié)講述更多 CSS 方面的技術。我們只是希望展示文檔結構和可視表達是兩個完全不同的事物，并且結構化元素應被用來轉換文本，而不是強加顯示效果。

使用結構化元素，而不是無意義的垃圾

由于我們已經忘記或者根本不知道 HTML 和 XHTML 的用途是傳達結構化的意義，許多 HTML 爭論者這樣使用標簽來插入列表：

項目一

項目二

項目三

考慮一下使用有序或者無序列表取而代之：

項目一
項目二
項目三

"但是li給我一個圓點，而我不需要圓點！"你也許會這么說。根據上面的章節(jié)，CSS不對元素被期望的外觀做任何假定。它等待你來告訴它你所期待的元素外觀。關閉圓點是 CSS 的最基本的能力。它有能力使列表看起來和普通文本沒有兩樣，也可以使列表看起來像圖形導航欄，具有完整的反轉效果。

所以，請使用列表元素來標記列表。相似地，使用 strong 來代替 b，使用 em 代替 i，等等。在大多數桌面瀏覽器缺省狀態(tài)下，strong 的顯示效果和 b 相同，而 em 和 i 相同，同時也可以在不破壞文檔結構的情況下創(chuàng)建你期待的視覺效果。

盡管 CSS 不會為任何元素的顯示作假設，瀏覽器卻作了很多假設，并且我們還沒有碰到一個將 strong 顯示為其他效果而不是粗體字的瀏覽器（除非是被設計師創(chuàng)建的 CSS 指示以其他方式顯示）。假如你擔心某個陌生的瀏覽器不會將 strong 顯示為粗體字，你可以編寫這么一條 CSS 規(guī)則：

strong {
	font-weight: bold;
	font-style: normal;
	}

視覺元素和結構

Web標準不僅要求我們使用什么技術，還需要知道如何使用它們。使用XHTML編寫標記，同時使用CSS處理部分或全部布局，不僅會使站點更容易使用和更輕，同時節(jié)省大量帶寬。像我們之前使用的技術一樣，XHTML和CSS也被濫用和誤用。有品味的XHTML，就像冗長的HTML，是用戶帶寬和時間。長時間過量的CSS不能完全取代HTML代碼的性能；這只是一個被另一個取代的壞事情。