CSS 朝向目标CSS FAQ

原文：http://wiki.github.com/stubbornella/oocss/faq（汉语翻译时为Version 28）
汉语翻译：ytzong

在OOCSS中如何界定“目标”？

目标相近JAVA中的类，维持着OO的特点。

1个CSS目标由4一部分构成：

1. 将会是1个或好几个DOM连接点的HTML
2. 由wrapper连接点的class名刚开始的CSS款式申明
3. 相近于情况照片和显示信息用的sprites组件和
4. JavaScript个人行为，监视或与目标关系的方式

这将会让人难以相信，由于每一个CSS class并不是其本身必要的目标，但能够是1个wrapper class的1个构件。例如：

<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>

目标是1个class为mod的控制模块。包含4个构件连接点（不可以单独于控制模块外，包含2个区块，inner和body，和两个可挑选的区块，head和foot）

OOCSS怎样提高特性？

OOCSS具备双倍的特性优点：

1. 高宽比重用的CSS编码，只必须非常少的CSS编码，代表着：
   • 更小的文档，从而更快的传送
   • CSS编码在站点网页页面中启用的比重增大则有期待被复用或被访问器缓存文件
2. 就访问器而言更少的重绘和合理布局测算
   • 单独网页页面，CSS标准复用的越多，3D渲染模块花在“computed values”的测算時间越少
   • 手动式提升的"extending"类，重新写过更少的标准，这再1次代表着模块做非常少去运用标准

要用ID来对內容写款式吗？

当你在同1网页页面（或同1站点另外缓存文件优良）复用1个目标时，这是特性的“完全免费赠品”。用ID来写款式在同1网页页面中只能应用1次。@cgriego (twitter) 拿它与singletons较为过，我觉得十分精准。将会一些状况下你要用ID界定款式，例如十分独特的 header menus，此时你能够在用ID来沙箱（译注：动名词）独特元素并保证此处的编码不容易危害站点的其它地区。挑选ID而非class前要3思，伴随着站点的发展趋势，真的很难意料别的人会如何解决根据你的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中，但是别用它们来写款式。

设计方案师能够写OOCSS吗？

是的，设计方案师出于本能反应了解目标，比大部分人当今撰写CSS的方法要形象 — layers of exceptions (想1下，1个老婆婆吞了1只苍蝇)。客观事实上，她们爱上OOCSS的缘故有两个：

1. 这使她们能迅速建立繁杂高点一下量的站点。她们不需纠结于没理解的构造除非有充足的工作能力并充裕的掌握英语的语法
2. 学CSS时，她们不需建立丑恶的 “hello world!” 站点。设计方案师在十分在乎的是她们的工作中看起来很好看。假如必须做1些丑恶的东东，就算是学习培训之由，她们很快就会有挫败感并灰常的烦闷。OO-CSS 使得她们的工作中在每一个学习培训环节都看起来很好看

设计方案师是聪慧D。大家要给她们信赖。她们会讲1种不一样的，非工程项目师的語言，可是极客的語言常常以1种丑恶的方法来回绝人。大家能做的更好。

我是个前端开发构架师，怎样向精英团队教给OOCSS？

做为构架师，你应当写构造目标；圆角怎样建立，为角或别的特点置放表象元素，并解决访问器差别。初学者为这些控制模块写皮肤（borders, colors, background images, 这些）。

我用OO-CSS方法建立了大批站点（千级的网页页面，百万级的浏览者）。正确的进行后，很好拓展，这代表着初学者将解决的某些元件可预料性很强。编码审查很非常容易，由于有可接纳的方式确立的标准来拓展目标。这类回馈使新开发设计者迅速生产制造。

我在FullSIX（1个法国的互联网营销推广组织）管理方法1个前端开发开发设计精英团队，是我工作中过的最有才可以的。一些情况下大家的取得成功代表着大家可能有更多么难以把控的工作中。聘请前端开发权威专家十分艰难（沒有这类院校！），因此我刚开始 对1些对写编码有兴趣爱好的设计方案师（非常少或沒有工作经验）实行1个內部实习新项目 ，1个月便可以做为精英团队的初中级组员工作中。

• 第1周：学习培训词义并依据现有的CSS建立HTML。学习培训建立网页页面：不必须更多的CSS，HTML英语的语法，好几个class，认证，词义，详细介绍编码审查等
• 第2周：建立简易的內容目标（题目，目录等），不断1周。学习培训CSS英语的语法，如何拓展目标，色调，字体样式百分比，这些
• 第3周：建立区块的皮肤。边框，色调，情况照片，基础的合理布局，sprites。让她们同1个回应过n个难题的资深开发设计者1起工作中，使她们少走弯路，他也应是很好的编码审查者。
• 第4周：她们早已是精英团队的皮肤制做组员了。

她们的编码在1个顾客的网站上，同资深开发设计者写的1样好，也许更好由于她们还未学到1些坏习惯性:)

新手入门：怎样应用这些文档？

3个文档，libraries.css (reset 及 fonts 取自 yui), grids.css 及 template.css 已进行，其它的还十分不平稳。

1. 开启template.html并存为新文档
2. 根据拓展相应的目标来改变列的数量及宽度。站点中只需1个模版，即便你有不一样列的网页页面，由于列也是目标。能够把它们作为随意的地区，将会会有0 ~ n 个左列。查阅模版文本文档可掌握更多
3. 用栅格数据来切分內容地区为小的区块。查阅栅格数据文本文档掌握更多
4. 加上內容。提醒：这也应OO

怎样布署在站点上？

留意CSS文档在不断完善中，我会根据接到的意见反馈开展更改。

我把CSS文档分成了控制模块，例如栅格数据和模版。在应用时移除无须要的注解并降低HTTP恳求，不然站点会非常慢。这代表着要合拼CSS文档为1个稍大的文档。我根据嵌套循环的注解来机构CSS。最终，做为上线/布署的1一部分，用CSS缩小器来移除注解.