[讓CSS更規範]div和span

摘自《精通CSS:高級Web標準解決方案》

有助於在文檔中添加結構的一個元素是div元素。許多人誤以爲div元素沒有語義意義。但是,div實際上代表部分(division),它提供了將文檔分割爲有意義的區域的方法。所以,通過將主要內容區域包圍在div中並分配ID mainContent,就可以在文檔中添加結構和意義。

爲了將不必要的標記減到最少,應該只在沒有現有元素能夠實現區域分割的情況下使用div元素。例如,如果使用主導航列表,那麼不需要將包圍在div中。

可以完全刪除div,直接在列表上應用ID:


  •  
  • Home
     
  • About us
     
  • Contact

過度使用div常常稱爲“多div症”(divitus),這是代碼結構不合理而且過分複雜的一個信號。一些CSS新手會嘗試用div重建自己原來的表格結構。但是,這只是用一套不必要的標籤替換了另一套不必要的標籤。實際上,應該使用div根據條目的意義或功能(而不是根據它們的表現方式或佈局)對相關條目進行分組。

div可以用來對塊級元素進行分組,而span可以用來對行內元素進行分組或標識:

Where's Durstan?


Published on March 22nd, 2005
by Andy Budd

一般不需要對行內元素進行分組或標識,所以使用span的情況比div少。在實現圖像替換等效果時會看到span。不這種情況下,它們用做額外的鉤子,可以應該額外的樣式。

儘管目標是保持代碼儘可能簡潔且有意義,但是有時候爲了以希望的方式顯示頁面,無法避免添加額外的無語義的div或span。如果是這種情況,那麼也不必過分爲此擔心。我們正處在一個過渡時期,CSS3有望提供更強大的文檔控制能力。在目前,現實世界的需要常常比理論出現得早。關鍵是知道在什麼時候必須進行折中,並且要根據正確的原因進行折中。

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