物件導向CSS FAQ

原文： http://wiki.github.com/stubbornella/oocss/faq （譯時為Version 28）
翻譯： ytzong

在OOCSS中怎麼定義「對象」？

物件類似JAVA中的類，保持著OO的特徵。

一個CSS物件由4部分組成：

1. 可能是一個或多個DOM節點的HTML
2. 由wrapper節點的class名稱開始的CSS樣式聲明
3. 類似背景圖片和顯示用的sprites元件以及
4. JavaScript行為，監聽或與物件關聯的方法

這可能令人費解，因為每個CSS class不是其自身必要的對象，但可以是一個wrapper class的一個部件。比如：

<div class="mod">
<div class="inner">
<div class="hd">Block Head</div>
<div class="bd">Block Body</div>
<div class="ft">Block Foot</div>
</div>
</div>

物件是一個class為mod的模組。包括4個部件節點（不能獨立於模組外，包括2個區塊，inner和body，和兩個可選擇的區塊，head和foot）

OOCSS如何提升效能？

OOCSS具有雙倍的效能優勢：

1. 高度重用的CSS程式碼，只需要很少的CSS程式碼，意味著：
   • 更小的文件，從而更快的傳輸
   • CSS程式碼在網站頁面中呼叫的比重增大則有希望被重複使用或被瀏覽器緩存
2. 就瀏覽器而言更少的重繪和佈局計算
   • 單一頁面，CSS規則復用的越多，渲染引擎花在「computed values」的運算時間越少
   • 手動增加的"extending"類，重寫更少的規則，這再一次意味著引擎做很少去應用規則

要用ID來對內容寫樣式嗎？

當你在同一頁（或同一網站同時快取良好）重複使用一個物件時，這是效能的「免費贈品」。用ID來寫樣式在同一頁面中只能使用一次。 @cgriego (twitter) 拿它與singletons比較過，我認為非常精確。可能有些情況下你要用ID定義樣式，例如非常特殊的header menus，此時你可以在用ID來沙箱（譯註：動名詞）特殊元素並確保此處的代碼不會影響站點的其它地方。選擇ID而非class前要三思，隨著網站的發展，真的很難預料其他人會怎麼處理依據你的CSS所建構的HTML。如有選擇的餘地，盡可能的考慮擴展性。

我正在考慮移除模板head, body, foot中的ID。某些人或許有多個主區域。網站的多個header 和footer更難以猜測，但我敢打賭肯定有設計師會這樣想，所以ID很可能會消失（不太順，看原文：Someone could have multiple main content areas. Multiple site headers and footers are more difficult to imagine, but I bet there is a designer who can dream up something like that, so the IDs are very likely to disappear.）。

另一方面，ID hooks are great for linking。放在HTML中，不過別用它們來寫樣式。

出處： 99css