CSS簡寫能夠大大的縮小檔案的size，所以在寫樣式定義的時候，遇到可以簡寫的屬性，一律都用簡寫。

底下是有簡寫和沒簡寫的差別。

以下是簡寫的範例：

1. margin: 10px 9px 8px 7px;
   padding: 10px 9px 8px 7px;
   順序是：margin-top | margin-right | margin-bottom | margin-left。
   padding的順序也跟margin相同。
    
2. font: italic small-caps bold 12px/20px Verdana;
   順序是：font-style | font-variant | font-weight | font-size | line-height | font-family
   font-size和font-family需同時存在才能寫簡寫。
    
3. background: #fff url(bg.gif) no-repeat fixed left top;
   順序是：background-color | background-image | background-repeat | background-attachment | background-position。
   background比較特殊的地方是沒有規定特定的特性質，可以只設定其中一個，而忽略其他的特性。但是如果沒有設，就會變成預設值，所以要設定background的時候要注意，可能因為預設值而不小心覆蓋掉其他的設定。
    
4. border: 1px solid #000;
   順序是：border-width | border-style | border-color。
   這樣的書寫就把四個邊都統一成一種寫法，如果上、右、下、左需要不同的樣式的話就再另外書寫成border-top | border-right | border-bottom | border-left。
    
5. list-style: disc url(bg.gif) outside;
   list和background一樣，不一定要把全部屬性書寫出來，這邊的url也跟background一樣都是不加引號的，如果有需要用到背景圖的時候要注意。
    
6. outline: 1px dotted #fff;
   outline的簡寫是跟border一樣的，但是因為並非所有瀏覽器都有支援，所以使用並不多，最常使用的情況是在沒有reset的頁面，設定outline: 0;，這是為了消掉Firefox的連結點了周圍會出現的虛線框。
    
7. color: #000;
   顏色的簡寫很簡單，將原本6碼的顏色代碼兩兩一組，如果三組裡面的代碼都兩兩彼此相同，便可縮寫成3碼的簡寫。如#336699可以寫成#369，#ddeeff可以寫成#def，但是如果其中一組沒有兩兩彼此相同，那就得維持6碼的寫法。 如#334599只能維持6碼的寫法，這是沒辦法簡寫的，所以顏色的縮寫只有6碼和3碼這兩種而已。
    
8. margin: 0;
   CSS的單位值有pt、px、em、cm、ex…很多種，但是當數值是0的時候，這些單位值就應該要省略，因為單位對0來說是沒有意義的。

 

另外簡寫有幾點需要特別注意的：

1. margin、padding的值可以是1~4個，順序為：上、右、下、左(順時針的順序)
   如：margin: 10px 5px;這是指margin-top、margin-bottom是10px，margin-right、margin-left是5px。margin: 10px 5px 3px;這是指margin-top是10px，margin-right、margin-left是5px，margin-bottom是3px，以下為簡單的示意圖：
   
    
2. font的簡寫一定要有font-size和font-family。
    
3. 單行置中的方式有一項為：將高、行高設成一樣，我們會特別把這兩個屬性放一起，如果底下有font屬性就要特別再寫一次line-height屬性，不然行高會變為預設值而無法達成置中。
    
4. background的簡寫可以不全部寫出來，可以只寫顏色或是只加入背景圖，但是其他沒有寫到的，就會變成是預設值，所以背景原本要繼承上面屬性的，在這裡需要特別注意，會不會被預設值蓋過去。
    
5. 上述屬性值沒宣告會被預設值蓋掉的問題，可以將屬性值明確設定為inherit，而避免誤採用到預設值，不過就要留意那些屬性可以支援inherit繼承。
    
6. border屬性的順序並沒有那麼重要，三個可以任意排列，不過我們的順序都是寫成：border: 1px solid #ff0000;。