你未必知道的10個CSS技巧

css|技巧

1. font的簡寫
   CSS很多元素都有簡寫，font要特別和嚴格一些，font-size和font-family是必須的，而且要按照這個順序。因為font用到的地方比較多，所以他可能特別提到。簡寫能有效減小你的CSS檔案的體積。
2. class屬性疊加
   其實在class中可以同時加入多個屬性，屬性用空格隔開。例如：<p class="text side">...</p>這樣<p>就繼承了.text和.side的有效屬性（衝突的地方會自動被排斥）。隨便提一下kubrick主題中也有一個地方使用了這個方法。該文章回複的使用者提到IE在處理多屬性時可能存在問題。
3. border的預設值
   當你使用border簡寫時沒有指定border-width和border-color時，border是有預設值的，寬度為medium（大概3到4個象素），顏色為框內文本的顏色。
4. !important不理會IE
   在CSS規則中，!important會使該規則額外優先，而IE卻聽不懂這條規則，那麼在某些時候這個技巧會非常有用。
5. 圖片移魂大法
   你先看看原文的敘述，我談談我的經曆。哈哈，我最早在zeldman的Blog上發現了這個技巧，注意他的導航條，滑鼠移至上方時空心字圖片會變為實心，而實際上這是一張圖片。呵呵，你再去分析一下他的CSS就知道了。
6. 盒模式的另類hack法
   IE6以前的版本都有對盒模式的錯誤理解。以前都是看用CSS的聲音屬性來處理IE6以下版本的效果，這次你可以看看另外一種方法，看上去更簡單方便。
7. 塊元素置中
   我們一般都使用指定塊寬度再把左右margin設定為auto來置中。殊不知有時會在IE6之前的版本出現問題。去看看解決技巧，有CSS樣本。
8. 垂直置中
   CSS對垂直置中比較弱，沒有表格那麼靈活。而且vertical-align這個屬性你就是用了也是不起作用的。方法就在於用行高來解決，把行高設定為整個box的高度。
9. 子容器的定位
   CSS的奇妙除了可以讓對象隨處定位外，還可以讓子容器也做得到。這個用處也很多。比如Binary Bonsai的導航條。
10. 控制螢幕底部的背景色
    這個請看原文的詳細講解了。