在网页上，有两个控制块(主要和次要)，什么类名称大多数人使用？
选择1：
<div class="primary controls"> <button type="button">Create</button> </div> <div class="secondary controls"> <button type="button">Edit</button> <button type="button">Remove</button> </div>
选择2：
<div class="primary-controls controls"> <button type="button">Create</button> </div> <div class="secondary-controls controls"> <button type="button">Edit</button> <button type="button">Remove</button> </div>
解决方法
这个问题的直接答案是
right below this one，由Curt。
如果你对css类命名约定感兴趣，我建议考虑一个非常有用的约定名为BEM(Block，Element，Modifier)。
UPD。请在这里阅读更多 – http://getbem.com/naming/ – 这是一个更新的版本，使以下回答过时。
主要原则：
>页面由独立的块构成。 Block是一个html元素，其类名具有“b-”前缀，例如“b-page”或“b-login-block”或“b-controls”。
>所有css选择器都基于块。不应该有任何不以“b-”开头的选择器。
好：
.b-controls .super-control { ... }
坏：
.super-control { ... }
>如果你需要另一个块(在另一个页面上)类似于你已经拥有的块，你应该添加一个修饰符到你的块，而不是创建一个新的。
例：
<div class="b-controls">
<div class="super-control"></div>
<div class="really-awesome-control"></div>
</div>
使用修饰符：
<div class="b-controls mega"> <!-- this is the modifier -->
<div class="super-control"></div>
<div class="really-awesome-control"></div>
</div>
然后你可以在css中指定任何修改：
.b-controls { font: 14px Tahoma; }
.b-controls .super-control { width: 100px; }
/* Modified block */
.b-controls.mega { font: 20px Supermegafont; }
.b-controls.mega .super-control { width: 300px; }
如果您有任何问题，我很乐意与您讨论。我一直在使用BEM两年，我声称这是我见过的最好的约会。
