原文:http://wiki.github.com/stubbornella/oocss/faq(翻譯時為Version 28) 翻譯:ytzong
在OOCSS中怎么定義“對象”?
對象類似JAVA中的類,保持著OO的特征。
一個CSS對象由4部分組成:
- 可能是一個或多個DOM節(jié)點的HTML
- 由wrapper節(jié)點的class名開始的CSS樣式聲明
- 類似于背景圖片和顯示用的sprites組件以及
- JavaScript行為,監(jiān)聽或者與對象關(guān)聯(lián)的方法
這可能令人費解,因為每個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個部件節(jié)點(不能獨立于模塊外,包括2個區(qū)塊,inner和body,和兩個可選擇的區(qū)塊,head和foot)
OOCSS如何提升性能?
OOCSS具有雙倍的性能優(yōu)勢:
- 高度重用的CSS代碼,只需要很少的CSS代碼,意味著:
- 更小的文件,從而更快的傳輸
- CSS代碼在站點頁面中調(diào)用的比重增大則有希望被復(fù)用或被瀏覽器緩存
- 就瀏覽器而言更少的重繪和布局計算
- 單個頁面,CSS規(guī)則復(fù)用的越多,渲染引擎花在“computed values”的計算時間越少
- 手動增加的"extending"類,重寫更少的規(guī)則,這再一次意味著引擎做很少去應(yīng)用規(guī)則
要用ID來對內(nèi)容寫樣式嗎?
當(dāng)你在同一頁面(或者同一站點同時緩存良好)復(fù)用一個對象時,這是性能的“免費贈品”。用ID來寫樣式在同一頁面中只能使用一次。@cgriego (twitter) 拿它與singletons比較過,我認(rèn)為非常精確?赡苡行┣闆r下你要用ID定義樣式,比如非常特殊的 header menus,此時你可以在用ID來沙箱(譯注:動名詞)特殊元素并確保此處的代碼不會影響站點的其它地方。選擇ID而非class前要三思,隨著站點的發(fā)展,真的很難預(yù)料其他人會怎么處理依據(jù)你的CSS所構(gòu)建的HTML。如有選擇的余地,盡可能的考慮擴展性。
我正在考慮移除模板head, body, foot中的ID。某些人或許有多個主區(qū)域。站點的多個header 和 footer更難以猜測,但我敢打賭肯定有設(shè)計師會這樣想,所以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
責(zé)任編輯:bluehearts
上一頁 下一頁 面向?qū)ο驝SS FAQ [2]
◎進入論壇網(wǎng)頁制作、WEB標(biāo)準(zhǔn)化版塊參加討論,我還想發(fā)表評論。
|