網(wǎng)上有很多種對(duì)此的答案：先寫(xiě)HTML后寫(xiě)CSS；先寫(xiě)CSS后寫(xiě)HTML；兩者同時(shí)寫(xiě)。

我在平時(shí)做html頁(yè)面是選擇的兩者同時(shí)進(jìn)行，首先先建立好網(wǎng)站大致目錄文件，如imges:存放頁(yè)面圖片；js： 存放JS腳本語(yǔ)言，而CSS文件我建議直接放到images文件夾里，這樣好處以免，在調(diào)用圖片背景時(shí)候把圖片路徑搞錯(cuò)了，再是就是方便維護(hù)圖片名稱(chēng)；自然html頁(yè)面則放到根目錄下。

然后我們先寫(xiě)HTML中的最基本的布局部分，都是用DIV，然后直接在DIV里加入ID或CLASS(ID與CLASS區(qū)別)，這些布局部分包括外套部分，頭部分，中間部分，左，中，右，版權(quán)部分等。其中頭部、中間、底部基本都是大概頁(yè)面的通用部分，大部分網(wǎng)頁(yè)都是由這3個(gè)大部分組成。我們把這些部分用ID或class命名好后，再到css樣式文件里寫(xiě)對(duì)應(yīng)的css樣式屬性。而在css寫(xiě)前我們要把全局全站的div、h1、h2、字體、字體大小、li等等樣式定義好這里不就不詳細(xì)講了，如想了解請(qǐng)進(jìn)我用的全局定義css模板了解下載使用，這樣以來(lái)就不用每次新做網(wǎng)站的時(shí)候而重新定義，而直接拷貝通用的基本CSS樣式定義模板即可使用。

一般在制作DIV+CSS的時(shí)候新手最好是同時(shí)進(jìn)行html與CSS，這樣可以減少錯(cuò)誤。在制作中如果經(jīng)驗(yàn)不是很好的時(shí)候，希望在制作過(guò)程中多種不同的品牌版本瀏覽器中測(cè)試是否兼容有沒(méi)有出現(xiàn)在這個(gè)瀏覽器中顯示正常，而在另外瀏覽器卻出現(xiàn)顯示不全錯(cuò)亂等。從而解決和了解掌握基本兼容問(wèn)題，積累寶貴的DIV+CSS技術(shù)經(jīng)驗(yàn)，并習(xí)慣做上筆記，以免日后忘記。

下面我們了解下先寫(xiě)html然后再寫(xiě)css：
為什么說(shuō)有些有經(jīng)驗(yàn)者對(duì)新手說(shuō)我們不可能一次性把HTML部分寫(xiě)好呢？因?yàn)槿硕际强赡芊稿e(cuò)誤的，可能你的想法寫(xiě)的過(guò)程就是有問(wèn)題的，或者為了瀏覽器的兼容性問(wèn)題，有些是你由于經(jīng)驗(yàn)的不足沒(méi)有提前預(yù)料到，所以當(dāng)你寫(xiě)樣式時(shí)發(fā)現(xiàn)了問(wèn)題時(shí)就有可能要改動(dòng)你的HTML的代碼。如果先把html寫(xiě)好后可能頁(yè)面大了后，會(huì)忘記你在html中想到的對(duì)css屬性布局選擇。

接著我們了解下先寫(xiě)CSS然后再寫(xiě)html：
對(duì)應(yīng)有經(jīng)驗(yàn)的CSS制作者來(lái)說(shuō)，這種是比較有可行性的比起先寫(xiě)html后寫(xiě)css來(lái)說(shuō)。為什么呢？我們知道CSS的繼承父級(jí)屬性特點(diǎn)是相當(dāng)好，這樣以來(lái)我們可以通過(guò)這點(diǎn)來(lái)先寫(xiě)CSS。但是對(duì)于新手來(lái)說(shuō)不能這樣，如果你先寫(xiě)好CSS后在回到html頁(yè)面寫(xiě)是回頭看你寫(xiě)的css及會(huì)忘記怎么調(diào)用選擇了，因?qū)SS兼容問(wèn)題沒(méi)有經(jīng)驗(yàn)而同時(shí)這樣兼容性也相當(dāng)差。而有經(jīng)驗(yàn)者通過(guò)父級(jí)繼承特點(diǎn)來(lái)排版css文件代碼，而返回html時(shí)調(diào)用CSS中class類(lèi)和id時(shí)很清楚不容易出錯(cuò)。

通過(guò)以上對(duì)先后的寫(xiě)法都作出了介紹與解釋?zhuān)侵档谜f(shuō)的一般制作頁(yè)面時(shí)候我們通常是采用兩者同時(shí)進(jìn)行+瀏覽器測(cè)試進(jìn)行。兩者同時(shí)或半先寫(xiě)css再寫(xiě)html或相反的半先寫(xiě)html再寫(xiě)css是非常好的，這樣不容易出錯(cuò)，以免出錯(cuò)后浪費(fèi)時(shí)間修改。

以上的說(shuō)法不一定完全是正確但是通過(guò)以上想告訴DIV+CSS制作開(kāi)發(fā)者，無(wú)論是先寫(xiě)html還是先寫(xiě)CSS這個(gè)并不重要，重要是你對(duì)div+css的喜愛(ài)加在日常不停的練習(xí)，你也可以HTML/CSS同時(shí)進(jìn)行，都是可以的，看你的習(xí)慣。但你開(kāi)發(fā)制作多了自然會(huì)總結(jié)出適合自己，而開(kāi)發(fā)快的方法來(lái)。希望以上對(duì)你有幫助。

相信看了這些案例你已經(jīng)掌握了方法，更多精彩請(qǐng)關(guān)注php 其它相關(guān)文章！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。