網頁版面的時候先寫HTML還是先寫CSS

很多朋友都有自己的習慣，有的人喜歡先寫CSS，有的人喜歡先寫HTML，那麼網頁版面最科學的寫法流程是什麼呢？今天來跟大家一起分析一下

網路上有很多種對此的答案：先寫HTML後寫CSS；先寫CSS後寫HTML；兩者同時寫。

我在平常做html頁面是選擇的兩者同時進行，首先先建立好網站大致目錄文件，如imges:存放頁面圖片；js： 存放JS腳本語言，而CSS檔案我建議直接放到images資料夾裡，這樣好處以免，在呼叫圖片背景時候把圖片路徑搞錯了，再是就是方便維護圖片名稱；自然html頁面則放到根目錄下。

然後我們先寫HTML中的最基本的佈局部分，都是用DIV，然後直接在DIV裡加入ID或CLASS(ID與CLASS區別)，這些佈局部分包括外套部分，頭部部分，中間部分，左，中，右，版權部分等。其中頭部、中間、底部基本上都是大概頁面的通用部分，大部分網頁都是由這3個大部分組成。我們把這些部分用ID或class命名好後，再到css樣式檔案裡寫對應的css樣式屬性。而在css寫前我們要把全域全站的div、h1、h2、字體、字體大小、li等等樣式定義好這裡不就不詳細講了，如想了解請進我用的全局定義css模板了解下載使用，這樣以來就不用每次新做網站的時候而重新定義，而直接拷貝通用的基本CSS樣式定義模板即可使用。

一般在製作DIV+CSS的時候新手最好是同時進行html與CSS，這樣可以減少錯誤。在製作中如果經驗不是很好的時候，希望在製作過程中多種不同的品牌版本瀏覽器中測試是否兼容有沒有出現在這個瀏覽器中顯示正常，而在另外瀏覽器卻出現顯示不全錯亂等。從而解決了解掌握基本相容問題，累積寶貴的DIV+CSS技術經驗，並習慣做上筆記，以免日後忘記。

下面我們了解下先寫html然後再寫css：
為什麼說有些有經驗者對新手錶說我們不可能一次把HTML部分寫好呢？因為人都是可能犯錯的，可能你的想法寫的過程就是有問題的，或者為了瀏覽器的兼容性問題，有些是你由於經驗的不足沒有提前預料到，所以當你寫樣式時發現了問題時就有可能要改變你的HTML的程式碼。如果先把html寫好後可能頁面大了後，會忘記你在html中想到的對css屬性佈局選擇。

接著我們了解下先寫CSS然後再寫html：
對應有經驗的CSS製作者來說，這種是比較有可行性的比起先寫html後寫css來說。為什麼呢？我們知道CSS的繼承父級屬性特點是相當好，這樣以來我們可以透過這點來先寫CSS。但對於新手來說不能這樣，如果你先寫好CSS後在回到html頁面寫是回頭看你寫的css及會忘記怎麼調用選擇了，因對CSS兼容問題沒有經驗而同時這樣兼容性也相當差。而有經驗者透過父級繼承特點來排版css檔案程式碼，而返回html時呼叫CSS中class類別和id時很清楚不容易出錯。

透過以上對先後的寫法都作出了介紹與解釋，但是值得說的一般製作頁面時候我們通常是採用兩者同時進行+瀏覽器測試進行。兩者同時或半先寫css再寫html或相反的半先寫html再寫css是非常好的，這樣不容易出錯，以免出錯後浪費時間修改。

以上的說法不一定完全是正確但是透過以上想告訴DIV+CSS製作開發者，無論是先寫html還是先寫CSS這個並不重要，重要是你對div+css的喜愛加在日常不停的練習，你也可以HTML/CSS同時進行，都是可以的，看你的習慣。但你開發製作多了自然會總結出適合自己，而開發快的方法來。希望以上對你有幫助。

相信看了這些案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

相關閱讀：

CSS的文字字體顏色如何設定

#在HTML的網頁版面裡div與span有什麼差別

css裡的font文字怎麼設定

以上是網頁版面的時候先寫HTML還是先寫CSS的詳細內容。更多資訊請關注PHP中文網其他相關文章！