什麼(me)是DIV＋CSS？做網站有哪些優勢？

對(duì)于新手或入門者來說，往往會有這(zhè)幾方面(miàn)的疑問：

    什麼(me)是DIV＋CSS？實質是什麼(me)？

    DIV+CSS的優勢何在？

    新手學(xué)習div＋css，該如何入門？

    使用什麼(me)軟件來布局頁面(miàn)和編輯css呢？

    能(néng)不能(néng)提供幾個實例具體講解一下怎麼(me)來實現？

    諸如此類的問題，是新手們最常問的。回答這(zhè)些問題，也是仁者見仁，智者見智了。不過(guò)從嚴格的角度來講，div＋css的叫(jiào)法是不對(duì)，隻不過(guò)像我們這(zhè)些菜鳥級的都(dōu)這(zhè)樣(yàng)叫(jiào)，習慣了而已。

1、那麼(me)DIV＋CSS是什麼(me)意思呢？實質是什麼(me)？

    要弄懂這(zhè)個意思，首先你要對(duì)網頁有一定了解，對(duì)和div相對(duì)的table布局有很好(hǎo)的認識，這(zhè)樣(yàng)理解起(qǐ)來就不難了。

    DIV+CSS是網站标準（或稱“WEB标準”）中常用的術語之一，通常爲了說明與HTML網頁設計語言中的表格（table）定位方式的區别，因爲XHTML網站設計标準中，不再使用表格定位技術，而是采用DIV+CSS的方式實現各種(zhǒng)定位。 用div盒模型結構給各部分内容劃分到不同的區塊，然後(hòu)用css來定義盒模型的位置、大小、邊框、内外邊距、排列方式等。

    CSS是英語Cascading Style Sheets（層疊樣(yàng)式表單）的縮寫，它是一種(zhǒng)用來表現 HTML 或 XML 等文件式樣(yàng)的計算機語言。在我們用table布局時，都(dōu)曾接觸和應用到css。

    DIV元素是用來爲HTML文檔内大塊（block-level）的内容提供結構和背景的元素。DIV的起(qǐ)始标簽和結束标簽之間的所有内容都(dōu)是用來構成(chéng)這(zhè)個塊的，其中所包含元素的特性由DIV标簽的屬性來控制，或者是通過(guò)使用樣(yàng)式表格式化這(zhè)個塊來進(jìn)行控制。

    簡單地說，div 用于搭建網站結構（框架）、css 用于創建網站表現（樣(yàng)式/美化），實質即使用XHTML對(duì)網站進(jìn)行标準化重構，使用CSS將(jiāng)表現與内容分離，便于網站維護，簡化html頁面(miàn)代碼，可以獲得一個較優秀的網站結構便于日後(hòu)維護、協同工作和搜索引擎蜘蛛抓取。

    當然不是所有的網頁都(dōu)需要用div布局，例如數據頁面(miàn)、報表之類的頁面(miàn)的時候還(hái)是會用table，web 标準裡(lǐ)并沒(méi)有說要摒棄table。所謂DIV+CSS布局的叫(jiào)法讓人更爲擔心，不要讓DIV成(chéng)爲Table的替代品，多層嵌套的DIV會嚴重影響代碼的可閱讀性，活用HTML爲我們提供的标簽吧。

2、DIV+CSS的優勢何在？

    1：表現和内容相分離

    將(jiāng)設計部分剝離出來放在一個獨立樣(yàng)式文件中，HTML文件中隻存放文本信息。符合W3C标準，微軟等公司均爲W3C支持者。這(zhè)一點是最重要的，因爲這(zhè)保證您的網站不會因爲將(jiāng)來網絡應用的升級而被(bèi)淘汰。

    2：提高搜索引擎對(duì)網頁的索引效率

用隻包含結構化内容的HTML代替嵌套的标簽，搜索引擎將(jiāng)更有效地搜索到你的網頁内容，并可能(néng)給你一個較高的評價。

    3：代碼簡潔，提高頁面(miàn)浏覽速度

對(duì)于同一個頁面(miàn)視覺效果，采用CSS+DIV重構的頁面(miàn)容量要比TABLE編碼的頁面(miàn)文件容量小得多，代碼更加簡潔，前者一般隻有後(hòu)者的1/2大小。對(duì)于一個大型網站來說，可以節省大量帶寬。并且支持浏覽器的向(xiàng)後(hòu)兼容，也就是無論未來的浏覽器大戰，勝利的是IE7或者是火狐，您的網站都(dōu)能(néng)很好(hǎo)的兼容。

    4：易于維護和改版

樣(yàng)式的調整更加方便。内容和樣(yàng)式的分離，使頁面(miàn)和樣(yàng)式的調整變得更加方便。你隻要簡單的修改幾個CSS文件就可以重新設計整個網站的頁面(miàn)。現在YAHOO,MSN等國(guó)際門戶網站，網易，新浪等國(guó)内門戶網站，和主流的WEB2.0網站，均采用DIV+CSS的框架模式，更加印證了DIV+CSS是大勢所趨。

3、新手學(xué)習div＋css，該如何入門？

    學(xué)習任何東西都(dōu)是一樣(yàng)，從小學(xué)、中學(xué)、大學(xué)，除了學(xué)習知識外就是去學(xué)習方法！要想學(xué)好(hǎo)網頁标準化布局，要先擯棄傳統的table布局時形成(chéng)的固定思維方式，用div布局，從内容出發(fā)。而且必須要對(duì)html标簽有很好(hǎo)的認識，起(qǐ)碼見了要知道(dào)它怎麼(me)用，幹什麼(me)的。因爲一個樣(yàng)式它是不可能(néng)脫離HTML頁面(miàn)的，HTML不與樣(yàng)式結合的話, CSS就失去了存在的意義。接下來就是css了，必須能(néng)寫出常用css的樣(yàng)式。

    學(xué)習方式可以從網上找現在的教程或資料學(xué)，如本站2010年9月新增的《十天學(xué)會web标準（div+css）》、6月新增的《新手常見問題系列視頻教程》和之前的CSS網頁布局初級入門教程、DIV+CSS網頁設計視頻教程（後(hòu)邊兩(liǎng)系列有點老，建議學(xué)習前邊的），都(dōu)是非常不錯的教程，相信通過(guò)這(zhè)一系列的學(xué)習，你就可以很快入門了。

    另外推薦幾本書：《CSS權威指南》《網站重構》《網站布局實錄》《HTML參考大全》。閱讀一本書，一般來說第一次要先把整個書通讀一遍，不理解的也要往下看，在往下看的過(guò)程中你也許會找到那個問題的答案。看完後(hòu)你有一個大概的印象，但一定有很多不明白的地方，沒(méi)關系，繼續往下看。第二遍你就要邊看邊做學(xué)習筆記了，把你認爲是重點的部分寫上，還(hái)有，你覺得有疑問的部分也要記下，帶著(zhe)疑問看下去，如果沒(méi)有答案，你可以去BBS上發(fā)一個貼子，好(hǎo)心人還(hái)是很多的，提示一句：“一定要學(xué)會如何去問問題!” 。你還(hái)要上機去練習書上的例子，最讓你困惑的：“一是記不住，二是對(duì)概念的理解有誤(這(zhè)一條可能(néng)是書譯的不好(hǎo)，另外就是你的理解不對(duì))”，對(duì)于第一條你就要樹立信心，堅持再堅持下去。當你到達終點時你回發(fā)現一切都(dōu)是順理成(chéng)章的事(shì)。因爲你努力了，努力了就會有回報，有結果。

4、使用什麼(me)軟件來布局頁面(miàn)和編輯css呢？

    關于這(zhè)個問題，隻要已經(jīng)能(néng)達到會手寫的程度，用什麼(me)軟件都(dōu)可以，比如記事(shì)本。對(duì)于新手來說推薦使用DreamWeaver、微軟出的FrontPage的替代品Microsoft Expression Web或TopStyle。