CSS精灵，指定类名

Question

哪个更合适。 （a）要有一个通常的类“sprite”，它总是与另一个类一起使用来选择坐标，或者（b）简单地将相同的属性分配给一个类列表？ （a）这样做更有意义，因为它代码少，速度可能更快。不利的一面是，这只需要（理论上）CSS开发人员与HTML进行交互。

.sprite { background: url('[..]') no-repeat; display: block; } 
.sprite.a { background-position: [..]; } 
.sprite.b { background-position: [..]; } 

（B）

.a, 
.b { background: url('[..]') no-repeat; display: block; } 
.sprite.a { background-position: [..]; } 
.sprite.b { background-position: [..]; } 

我忘记了什么？我应该使用哪一个？

Answer 1

我会使用sprite类来选择背景图像（以及可能的其他常见属性，如大小如果所有精灵都具有相同的大小），然后选择只指定背景位置的其他类。

由于您不必一直重复您的班级名称，这样可以使样式表可读并且更小。