在制作Xhtml頁面時是先寫HTML代碼還是先寫CSS代碼
15 . Feb . 2018
在制作Xhtml頁面時是先寫HTML代碼還是先寫CSS代碼
相信很多喜歡用DIV+CSS技術(shù)開發(fā)重構(gòu)網(wǎng)頁的愛好者朋友，在開始學(xué)習(xí)DIV+CSS的時候都會想一個問題，想知道DIV+CSS高手或有經(jīng)驗者在開發(fā)制作html頁面的時候，到底是先寫html還是先寫css？帶著這個問題我們將來講解到底先寫CSS好還是先寫html。
網(wǎng)上有很多種對此的答案：先寫HTML后寫CSS；先寫CSS后寫HTML；兩者同時寫。
我在平時做html頁面是選擇的兩者同時進(jìn)行，首先先建立好網(wǎng)站大致目錄文件，如imges:存放頁面圖片；js： 存放JS腳本語言，而CSS文件我建議直接放到images文件夾里，這樣好處以免，在調(diào)用圖片背景時候把圖片路徑搞錯了，再是就是方便維護(hù)圖片名稱；自然html頁面則放到根目錄下。
然后我們先寫HTML中的最基本的布局部分，都是用DIV，然后直接在DIV里加入ID或CLASS(ID與CLASS區(qū)別)，這些布局部分包括外套部分，頭部分，中間部分，左，中，右，版權(quán)部分等。其中頭部、中間、底部基本都是大概頁面的通用部分，大部分網(wǎng)頁都是由這3個大部分組成。我們把這些部分用ID或class命名好后，再到css樣式文件里寫對應(yīng)的css樣式屬性。而在css寫前我們要把全局全站的div、h1、h2、字體、字體大小、li等等樣式定義好這里不就不詳細(xì)講了，如想了解請進(jìn)我用的全局定義css模板了解下載使用，這樣以來就不用每次新做網(wǎng)站的時候而重新定義，而直接拷貝通用的基本CSS樣式定義模板即可使用。
一般在制作DIV+CSS的時候新手最好是同時進(jìn)行html與CSS，這樣可以減少錯誤。在制作中如果經(jīng)驗不是很好的時候，希望在制作過程中多種不同的品牌版本瀏覽器中測試是否兼容有沒有出現(xiàn)在這個瀏覽器中顯示正常，而在另外瀏覽器卻出現(xiàn)顯示不全錯亂等。從而解決和了解掌握基本兼容問題，積累寶貴的DIV+CSS技術(shù)經(jīng)驗，并習(xí)慣做上筆記，以免日后忘記。
下面我們了解下先寫html然后再寫css：
為什么說有些有經(jīng)驗者對新手說我們不可能一次性把HTML部分寫好呢？因為人都是可能犯錯誤的，可能你的想法寫的過程就是有問題的，或者為了瀏覽器的兼容性問題，有些是你由于經(jīng)驗的不足沒有提前預(yù)料到，所以當(dāng)你寫樣式時發(fā)現(xiàn)了問題時就有可能要改動你的HTML的代碼。如果先把html寫好后可能頁面大了后，會忘記你在html中想到的對css屬性布局選擇。
接著我們了解下先寫CSS然后再寫html：
對應(yīng)有經(jīng)驗的CSS制作者來說，這種是比較有可行性的比起先寫html后寫css來說。為什么呢？我們知道CSS的繼承父級屬性特點是相當(dāng)好，這樣以來我們可以通過這點來先寫CSS。但是對于新手來說不能這樣，如果你先寫好CSS后在回到html頁面寫是回頭看你寫的css及會忘記怎么調(diào)用選擇了，因?qū)SS兼容問題沒有經(jīng)驗而同時這樣兼容性也相當(dāng)差。而有經(jīng)驗者通過父級繼承特點來排版css文件代碼，而返回html時調(diào)用CSS中class類和id時很清楚不容易出錯。
通過以上對先后的寫法都作出了介紹與解釋，但是值得說的一般制作頁面時候我們通常是采用兩者同時進(jìn)行+瀏覽器測試進(jìn)行。兩者同時或半先寫css再寫html或相反的半先寫html再寫css是非常好的，這樣不容易出錯，以免出錯后浪費(fèi)時間修改。
作者：@悅閣網(wǎng)絡(luò)科技
悅閣網(wǎng)絡(luò)科技有限公司專業(yè)為中小企業(yè)提供精致的佛山網(wǎng)站建設(shè)、佛山網(wǎng)站設(shè)計、佛山網(wǎng)站制作及相關(guān)網(wǎng)絡(luò)營銷等服務(wù)，是廣佛地區(qū)最好的網(wǎng)絡(luò)科技公司之一，在廣佛做網(wǎng)站開發(fā)就找悅閣網(wǎng)絡(luò)科技！
您對建網(wǎng)站有需求？請回到首頁“悅閣網(wǎng)絡(luò)”官網(wǎng) 查找您想建哪種類型的網(wǎng)站，然后聯(lián)系我們客服QQ，我們將竭誠為您服務(wù)！
