老实说，这取决于个人开发人员和他们自己的感受。就像您建议的那样，有两种同样好的构造CSS类的方法：
.profile.image.large{ width: 300px;}.profile-image-large{ width:300px;}它们可以达到相同的目的，但是当您开始广泛思考时，您会发现这些样式之间的差距有多大。
分离班使他们可以重复使用：
该干的惯例是从不重复自己。通过分离
largeor
image类，我们可以 重用 相同的类：
.blue{ border: 3px solid blue; }.profile.blue{ border-style: dashed; }在第二种方法中-使用
-分隔符，代码将是：
.blue{ border: 3px solid blue; }.profile-blue{ border: 3px dashed blue; }在像这样的简单示例中
border，这似乎无关紧要。但是要考虑到更大的CSS块，您可能希望在整个代码中重复使用数十次。您会重复很多次。
从逻辑上将样式分组仍然是一件好事： 我并不是说这
-classes是一件坏事-它们有助于为您的代码定义名称空间，因此在维护 模块化
代码的意义上，用标识符加上前缀将有助于防止冲突，特别是如果您要在要重新使用的Web代理中开发代码，或者要构建插件（在这种情况下，绝对需要样式前缀）。
用诸如SCSS（我的首选环境）之类的编译语言进行开发也会改变您的想法。在SASS/SCSS中，我们可以轻松地做到这一点：
.profile{ display: block; &-image{ border: 1px solid blue; }}其结果与
profile profile-image元素相同。另外，SASS还支持：
.profile{ display: block; &.image{ border: 1px solid blue; }}profile image对一个元素求值。非常相似-但这_两种_样式都限于其父元素
.profile，并且不能全局使用。样式是受保护的，而在我的第一个“自然” CSS示例中，
blue可以通过HTML页面中的
任何 元素自由添加和合并类。
编辑： 您仍然可以
.image在SASS代码中使用全局样式，然后覆盖各个示例，但是就我个人而言，我认为这违反了DRY原则，因此我尝试避免这样做。
那么什么是TL; DR？
我认为，没有“正确答案”。从约定的角度来看，值得注意的是，像Twitter-Boostrap这样的框架使用了两种样式的混合体-
可以在任何地方应用的全局类，与保护孩子样式的前缀类混合在一起。
对于 任何 程序员而言，最重要的是，您的代码清晰易读且易于定义，并且无论使用哪种方法，都使用尽可能少的代码来实现结果。
