css是寫前端網頁基本上都要用到的知識。一張呈現在你面前的網頁其實可以理解為是由很多個小塊組成的一個大塊，每個小塊裡面又可以分成很多個小塊去處理。而css就是定義這些塊的屬性，例如一個塊裡面的圖片它應該放的位置、大小等。
工具/原料
電腦、Dreamweaver或者其它前端網頁編輯軟體、耐心
方法/步驟
瞭解div
可以將一個網頁看成是由很多個div組合成的，例如下圖這個簡單的網頁就是由四個小的div組合成一個大的div，從而組成有個網頁。每個div都用css去控制它的屬性，那麼它就會呈現出我們想要的結果了，可以說精通CSS和DIV的結合運用可以大大提高你的工作效率。
瞭解網頁的基本組合板塊
可將一個網頁分成3大塊去展開自己的設計與排版——頭部、中間、底部。頭部主要由宣傳海報和導航欄組成，海報就是你想宣傳的內容，導航欄就是已整個網頁的導向。中間主要就是你網頁上想實現的內容了，可以將中間部分劃分成若干塊。底部就是一些宣告之類的。使用div+css就可以將網頁整個板塊大概的樣式設計出來了。
Css語法
Css要怎麼寫呢，怎麼識別一條css呢？其實css是有一個特定的語法的。如果你想用div+css的話。就需要提前給div命名。在Dreamweaver中可以新建一個獨立的css檔案去控制html檔案裡的div。例如在html檔案裡設定一個div並class給div命名為header，那麼在css檔案裡就可以設定header的屬性。格式為“‘.’+div命名的class名稱+‘一對{}（括弧中間就是設定這個div屬性的地方）’”class專業的說法是選擇器。
Css id 和class選擇器
Id也有和class相同的作用就是作為選擇器。也就是說，如果html的div檔案裡出現id=‘名稱’那麼這個id的css格式為“‘.’+id名稱+‘一對{}（括弧中間就是設定這個div屬性的地方）’”用id來做懸著器是可以方便以後做表格。如果是在同一個檔案裡編輯css和html，css可以寫成
Css建立
其實前面的幾個步驟中，都有所提到css的建立。Css建立的方法分為3種：外部樣式、內部樣式、內聯樣式。步驟3說的是一種外部樣式，即單獨建一個css樣式檔案與html
檔案獨立開來，同時步驟3中插入圖片的方法屬於css的內聯樣式。步驟4用到的是一種內部樣式，機css的引數直接寫在html檔案裡面。一個網頁是不單單隻有一種樣式存在的，什麼樣式最好表示就用什麼樣式。
使用css新增背景
網頁可以新增一個背景顏色，background-color屬性就是新增顏色作為背景的。也可以新增一張圖片作為背景。background-image就是用來定義背景圖片的。background-repeat即是定義背景圖片是重複使用的。背景還有其他的定義規則，如background-attachment、background-position
使用css做表格
使用css和table屬性可以大大提高網頁的美觀程度，其實也就是將div當成是一個個table，然後用css是將這一個個table排版成為一個表格。Table是一張表格，表格裡面含有hr和th兩種型別的內容。Css其控制這些所有內容該有的行為，例如border（邊界）屬性為大小1個畫素、實線。
Css盒子模型
Css盒子模型的含義就是將所有的html元素看作是盒子。用盒子概念去設計我們的網頁。CSS盒模型本質上是一個盒子，封裝周圍的HTML元素，它包括：邊距，邊框，填充，和實際內容。不難理解，其實盒子模型就是div理念的升級版（一個div就是一個盒子，盒子裡裝盒子）。
注意事項
本經驗只是提到了css的某些使用案例，主要還是作為一種引導讀者學習的一種目的，想要精通css，需要一個系統的學習哦