原子类的缺点：

1，维护困难。类似 m20（表示 margin 20px ） 这样的超级常用的原子类，会遍布网页中的很多 div，如果你想让他们变成 margin 15px，要么替换 .m20{} 中的 margin 20px （失去 m20 本身的意义），要么把 html 中的 m20 批量替换成 m15 。再给你一个要求，把一部分替换成 m15。恐怕只能一个一个粘贴复制了吧？

2，代码冗余。包括题主给出的和《编写高质量代码》一书中给出的原子类实例一样，为了灵活，把常用的字体都定义成了 f*、常用的尺寸都定义了 m* 和 p* 等。但实际上只会用到其中的几个，剩下的都是冗余代码。这对于中度代码洁癖的我来说，是很难受的，虽然只是几十行代码。

3，控制困难。当我第一次接触原子类并且用此重写了我一个非常简单的 WordPress 主题的时候，我几乎开始膜拜原子类。那个主题实在是简单，所以我几乎没有写 CSS ，只是在 模版文件 中的 div 中添加了众多的原子类就完成了布局。但是当我打算修改某个元素的样式时，有点崩溃，我究竟要用原子类的方式，还是传统的选择器？

1）如果用原子类，那么我需要定义新的原子类（通常不能随便修改之前的原子类），然后将新的原子类写到 html 标签的后面，来覆盖之前的样式。这样，就会遇到类似 <div class="aa bb cc dd ab ad cd sd">...</div> 的标签，Great！
2）用原子类构造选择器。这样就不用定义新的原子类了，但是你的 CSS 选择器看起来会像下面这样：.aa .bb .cc .ad.ab .ce{} 你确定不会眼花？
3）没办法，只能针对要修改的元素设置一个对应的类，例如 <h1 class="mb20 f14 fb post-title">...</h1> 然后对 .post-title 来定义要指定的特殊样式，然后将 post-title 类添加到所有需要的 h1 标签中。这时你会发现，我为什么不把前面的 mb20 f14 fb 原子类里面的三条语句一块写进 post-title 类中？这样修改的话只需要修改这一个类就可以了，而不需要找到 html 中，增删原子类。

就像 CSS 禅意花园那样，最好的 CSS 代码，是与 HTML 无关的，而原子类，让你在修改编写 CSS 的时候，增加了很多 HTML 的操作，这是最大的缺陷。

原子类的优点：

原子类也有相当多的优点，但是并不是所有的原子类。

1，便于抽出复用代码，提高代码复用程度。clearfix 类就是最好的一个例子，将一段用来清除浮动的 CSS 编写成 clearfix 类，在需要清除浮动的 元素 中，增加这个类就可以。类似的还有其他使用场景。

2，CSS 框架的应用。很多前端框架的 CSS 部分，特别是网格系统，都是原子类的具体应用。