我找到了几个广泛用于一个webstudio的CSS类：
.m20 {margin: 20px !important;}
.mh7 { margin: 0 7px !important;}
.mh10 { margin: 0 10px !important;}
.mb0 { margin-bottom: 0 !important}
.mb5 { margin-bottom: 5px !important}
.mt0 { margin-top: 0 !important}
.mt5 { margin-top: 5px !important}
etc.
主css文件中大约有40个相同的类。 它们被用作快速修饰符。
这是正常的吗？为什么？
答案 0 :(得分：5)
这很常见。这取决于你的优先事项。
您是否关心代码的可读性和可维护性？如果你这样做，那么也许你不应该使用这样的神秘类。
另一方面，对于像Facebook或其他高流量网站那样关心带宽的每个字节的网站，他们可能更有兴趣保持代码尽可能短，因此他们将拥有尽可能短的类名
对于您引用的特定代码，我会说这不是好代码，至少有三个原因：
大量使用!important修饰符
这几乎总是代码错误的标志 - 如果你必须经常使用!important，那么很明显你并没有真正好好利用CSS。它还可能导致需要调整相同元素样式的其他代码出现问题。
类名基于布局设计。因此m20适用于margin:20px
这是不好的做法，因为它将您的HTML（通过类名称）与布局联系起来。 CSS的重点是将HTML与布局分开，因此使用这样的类名有点打破了这一点。如果您希望网站在移动设备上的工作方式与桌面浏览器不同，那么它也会造成一些混乱;与这样的固定布局样式相关联的类名会使这更加困难
这样做的首选方法是使用描述元素用途的类名。例如，menuItem或infoPanel等
这对你的SEO有害。搜索引擎使用页面中的所有内容来确定其内容以及如何对其进行分类。这包括类和ID的名称。确实，这些不如实际内容重要，但为什么m20对您的搜索引擎优化没有任何作用，当您可以获得Google认为相关的内容时。
答案 1 :(得分：2)
我不会称之为正常或异常，但如果你想让一个人能够阅读和理解它，我就不会建议它。
我认为智能CSS压缩器可以重命名CSS类并更新HTML和Javascript以缩短它们，但这些压缩器的输出不适合人类阅读。您将使用源文件，然后在源文件上运行压缩器以生成乱码版本。
似乎这些类是选择器实际执行的缩写描述符，例如.m20为所有内容提供20px的余量。我的经验法则是使用类来描述函数的内容而不是外观。所以，我可能会使用.bright类。在一次设计迭代中，这可能是鲜红色。在随后的迭代中，它可以更改为紫色或其他任何东西。将其称为.bright而不是.red会使该类的名称独立于其执行的“工作”。
答案 2 :(得分：2)
他们有点神秘，而且我个人会使用更长的类名，但只要它们的名字一致，它们就不是一个大问题。我会看到的最大缺点是，如果你想将.mh7从7像素更改为8，这个名称就不再反映出它是什么了。您要么必须设置一个新的.mh8，要么记住.mh7确实是8.请参阅针对匈牙利表示法的投诉。
答案 3 :(得分：1)
它来自于错误的信念，短名称可以节省带宽，因此可以加快页面加载速度。虽然这是真的，但浏览器（除了iE 4及以下版本，几乎是pre-css-area）和配置良好的Web服务器都使用deflate或gzip压缩来传输css文件。 这意味着f1 .. f100不再占用foobar_damn_long_classname_1 ... foobar_damn_long_classname_100的带宽。 （第一次使用时留下一些字节）
所以我最好的建议是使用合格的，合理的长css类名。
答案 4 :(得分：0)
虽然Wild Wild Web上确实没有“正常”;）我会注意到：
在数百万页中存在这一点
最好拼出描述含义的真实姓名，用破折号分隔，例如