Div+css檢視原始碼討論檢視歷史
| Div+css |
|
外文名 ：div+css 本 質：WEB設計標準 特 點： 實現網頁頁面內容與表現相分離 領 域： 計算機 |
DIV+CSS：是WEB設計標準，它是一種網頁的布局方法。與傳統中通過表格（table）布局定位的方式不同，它可以實現網頁頁面內容與表現相分離。提起DIV+CSS組合，還要從XHTML說起。XHTML是一種在HTML（標準通用標記語言的子集）基礎上優化和改進的新語言，目的是基於XML應用與強大的數據轉換能力，適應未來網絡應用更多的需求。
「DIV+CSS」其實是錯誤的叫法，而標準的叫法應是XHTML+CSS。因為DIV與Table都是XHTML或HTML語言中的一個標記，而CSS只是一種表現形式。也許其提出者本意並沒有錯，但是跟風者從表現曲解了其意思，認為整個頁面就應當是DIV+CSS文件的組合。[1]
作用
1、精簡的代碼，使用DIV+CSS布局，頁面代碼精簡，這一點相信對XHTML有所了解的都知道。代碼精簡提高了百度蜘蛛的爬行效率以及高效性，能在最短的時間內爬完整個頁面，同時這樣對收錄質量有一定好處;
2、提高訪問速度、增加用戶體驗性
使得加載速度得到很大的提高，那麼用戶點擊頁面的等待時間就越少，用戶體驗性的增加相應的帶來就是網站受到搜索引擎的喜歡，進而提高網站排名。
3、div+css結構清晰，很容易被搜索引擎搜索到，天生就是適合優化seo，降低網頁大小，讓網頁體積變得更小。注意：div+css結構清晰、精簡，不意味着可以全部用div+css結構，比如通篇HTML標籤全DIV的，貌似除了<head>之上及<body>之上及之外，其它全是
- 結構的，就如同這個頁面所有元素全是列表。事實上這兩種情況還相當普遍，因為曲解了「DIV+CSS」的真實含義，也許根本就不應該有這個說法，因為一個完整頁面幾乎不可能僅僅DIV+CSS就能完成。[2]
方法
css是層疊樣式表（Cascading Style Sheets）的縮寫，用於定義HTML元素的顯示形式，是W3C推出的格式化網頁內容的標準技術。網頁設計者必須掌握的技術之一。[3]
在HTML文檔中加入CSS
樣式表可分為嵌入式樣式表、外部樣式表和內聯樣式表三種，在同一文檔內可以同時使用三種方法。
發展
1.樣式定義放在一個單獨的文件中，例：新建一個後輟為CSS的樣式定義。
元素{ 屬性color:值red；} 在head段使用<link>標記，
引用語法：<link rel=」stylesheet」 type=」text/css」 href=」樣式表URL」 />
2.嵌入式樣式表：
<style>元素段必須出現在head段內，有一個開始和結束標記，並且可以有多個<style>段
語法格式： <style type=」text/css」>
使用誤區
1、DIV+CSS的合理之處在於可以進行網頁的統一設計管理，通過一個樣式表，牽一髮而動全身，只要修改樣式表，就可以統一全站的風格，如果為一個頁面單獨做一個樣式表，或者一個div就做一個樣式表，沒有全局設計觀念，那麼這個div+CSS的設計方式就完全沒有必要，甚至成了累贅;
2、像Table一樣用DIV+CSS，無窮盡的嵌套，其效果與Table設計沒有兩樣，並不會帶來搜索引擎的優化效果，反而會增加頁面的負擔;
3、推崇Div+CSS，卻不考慮兼容性，TABLE設計由來已久，得到瀏覽器的廣泛支持，所以顯示效果很好，不會出現錯位情況，但是DIV+CSS卻在 部分瀏覽器中會發生頁面錯位的情況，因此在進行設計的時候也要考慮到不同瀏覽器的情況，進行更改和調試。[4]
視頻
DIV+CSS布局的操作方法
DIV+CSS頁面布局實例製作
參考資料