網頁佈局中CSS不正確十個常見原因

我們學習Div+CSS網頁佈局的知識，可是W3C validation有時難以操作，但用它你可以查看由版面設計引起的差錯。 驗證程式拋出大量差錯和警告，說明你的XHTML尚未完善，可能無法在不同瀏覽器上保持一致功能。 下面十個細微的失效問題難住了大批程式師，本文就告訴你如何解決。 在本文開始前介紹一些使用W3C驗證程式時需要注意的問題。

1、不要擔心驗證程式的警告：如果驗證程式說發現12處錯誤以及83處警告，不要理它，繼續進行下一步。

2、一次更正一個錯誤：按順序進展工作，從上到下，一次修正一個錯誤。 HTML用瀏覽器從上到下流覽，這些錯誤也是按同樣順序顯示。

3、每次修正代碼後要刷新代碼，使它們重新生效：一個小錯誤常常會引發之後整頁的連串錯誤。 因此如果操作不當，「修正錯誤」也可能引發更多錯誤。 每次修正後使代碼重新生效，這樣就可以確保完全解決問題。

知道了上面這些基本的異常情況，下面我們就來看看版面設計不正確幾個原因。

一、div 標籤未關閉

這是版面設計失效的最常見原因之一。 當我們瞭解到這是多少精緻的版塊設計失效的罪魁禍首時，總會大吃一驚。 開啟的div標籤是最普遍的版塊設計失誤之一，也是最難診斷的失誤之一。 驗證程式有時會指向錯誤的開啟div標籤，診斷時就像大海撈針一樣麻煩。

二、麻煩的embed標籤

九十年代早期，Microsoft和Netscape的瀏覽器開始能夠辨認非標準的獨有字體。 遺憾的是這意味著W3C驗證程式還不能識別某些關鍵HTML 標籤，如「embed」，即使這些標籤已經被廣泛使用。 如果確實希望得到嚴格的DOCTYPE(文件類型)驗證，就只能放棄嵌套。

如果同時想要生效的版面設計和嵌入式媒體，可以試試Flash Satay方法。

三、不當的DOCTYPE聲明

不聲明DOCTYPE，或者在檔開始錯誤聲明DOCTYPE，也是一個常見錯誤。 根據一般經驗，Strict DOCTYPE是大家追求的最高級驗證。 Strict validation表明你的網頁能夠在所有瀏覽器上都得到最佳展示。 關於DTD文件類型的聲明，您可以參考52CSS.com的相關文章。

四、結尾斜線

如果你的網站不能驗證，很有可能是在代碼的某個地方漏寫了結尾斜線。 我們很容易忽略結尾斜線之類的東西，特別是在image標籤等元素中。

在嚴格的DOCTYPE中這是不正確。 要在img標籤結尾處加上「/」以解決此問題。

五、Align標籤

如果DOCTYPE被設為Transitional，你就會使用「align」標籤，但如果要求更高一點希望得到Strict驗證，你會看到很多錯誤。 Align是另一個不可用於版面設計的標籤。 可以嘗試用「float」或者「text-align」來代替align轉換元素。

六、JavaScript

如果已經聲明Strict DOCTYPE，就需要在JavaScript中覆蓋CDATA標籤。 驗證程式的這一方面難倒了很多程式師，因為網站傾向于為廣告和追蹤腳本使用嵌入的 JavaScript。 如果必須用到JavaScript，可以在其前後加上如下標籤：

七、圖像需要「alt」屬性

你可能還沒有注意到，圖像也是高級驗證的潛在絆腳石。 除了結尾斜線，高級驗證也要求用alt標籤來描述圖像，如alt= 」Scary vampire picture」。

搜尋引擎也靠alt標籤來識別網頁上的圖像，所以無論怎樣加上alt標籤總是好的。

八、未知實體資料

實體資料是又一個影響驗證的易犯錯誤。 我們可以考慮用適當的編碼字元來代替「&」等符號。 entire list中列出在XHTML版塊設計中可用的適當的編碼字元實體資料。

九、不良嵌套

嵌套就是元素裡又包括元素，我們容易混淆嵌套元素的順序。 例如在div標籤前啟動strong標籤，但又先關閉div標籤。 這可能不會改變版塊佈局，但卻會使你的版塊設計失效。

十、缺少「title」標籤

儘管這看上去是一個很明顯的錯誤，很多程式師(包括我自己)還是經常會在「head」版塊中遺漏title標籤。 當你看到「missing a required sub-element of HEAD」(缺少HEAD的必要子項目)時，才會發現自己忘記添加title標籤了。