Question

SMACSS框架引入了一种管理CSS代码的一致方式，使其可重用和可维护，但它更像是如何组织CSS而不是实际框架的指南。如果有任何其他框架基于其哲学，那将是很好的，但我没有遇到任何。

有没有人知道任何基于组织CSS代码的SMACSS方法的CSS框架？

Answer 1

Pure是一个基于SMACSS的新CSS框架。它似乎与YUI项目有关。

来自extend page ...

基于SMACSS

Pure被分解为一组响应模块。从一开始，我们就采用SMACSS作为编写CSS的惯例。对于那些刚接触SMACSS的人，您应该快速阅读，特别是有关模块规则的部分。

Answer 2

由于没有任何答案从媒体上消失，我很好奇并且环顾四周。

事实证明有quite a few，and I see you have been at this for a while now。

I see others recommended LESS or SASS，我将添加Compass和Susy等解决方案。这些只是需要考虑的事情，因为它们各自都有固有的组织模式。

但这是我的实际答案。

我在寻找CSS框架方面做了类似的努力，这些框架将响应式Web设计的最终解决方案组织成最佳实践，命名约定和其他模式。 So here is what I was looking at，有一个等同的开放式问题，处于死胡同。

我认为也许问题可能是，CSS组织高度依赖于环境和背景。 So, maybe design patterns is a good approach

所以这是我的解决方案，我会在这里建议 - ＆gt;我非常喜欢你关于将css分成：base，layout，fonts，elements的注释。在某些情况下，这可以使其他人受益。

如果您无法找到适合您环境的组织方法，请尝试和设计您需要的内容，然后将其命名，并与全世界分享。

这对你很有益，因为：你学习如何解决你的问题，它作为一个高级开发人员很适合你。

一种方法是在wordpress博客，网站示例页面或github存储库中共享解决方案。

如果它真实有益，请将其命名，构建并分享。只有好事才能实现。

祝你好运！

Answer 3

我不知道Bootstrap是基于的在SMACSS上，但Jonathan Snook（SMACSS创始人）有以下说法：

＆＃34;如果您想知道SMACSS的示例实现可能是什么样的？ Bootstrap就是一个很好的例子。＆＃34;

Prefixed classes in bootstrap

Answer 4

如果您使用术语SMACSS作为OOCSS或Atomic design的同义词，请考虑以下框架：

Answer 5

SMACSS是一种编写CSS的惯例。所以如果框架本身遵循这个约定，框架本身并不重要。在使用任何框架时，您应该遵循SMACSS。

例如，有人为那些愿意在SMACSS中使用LESS的人制作了一些带有评论的.LESS文件：https://github.com/growdigital/LESS-SMACSS

Answer 6

您应该尝试帮助CSS ：http://helpers.araujo.cc/

非常容易学习和理解。

<p text="gray-80 normal center">
 <span text="bold big line-1 red">
    Can you
  </span> feel the
  <span text="underline italic blue semi-bold">
    future
  </span>? HTML6
  <span text="pre white-80 line-1.5" layout="navy few-rounded inline-block">  advantages  </span>
   are expecting for
   <span text="bolder">you</span>!
</p>

基于SMACSS的CSS框架

6 个答案: