用于解析和比较两个CSS样式表的工具

Question

有没有人知道一个好的工具可以解析和比较两个CSS样式表，以便找到哪些选择器有不同的样式？

我无法使用标准的类似diff的工具，因为两个CSS文件的布局非常不同。我需要一个可以解析和理解CSS的工具，然后在两个样式表中查找实际上具有不同样式的选择器。

我找到的唯一工具是CSS Comparer from Alan Hart，但是当有适用于多个选择器的样式时，它会感到困惑。

Answer 1

这是我最终做的事情，以防其他人遇到同样的问题：

1. 我使用CSSTidy来“规范化”我要比较的两个样式表。在我的情况下，标准化意味着拆分多个选择器并对选择器和属性进行排序。 CSSTidy的在线版本可用here。
2. 在此之后，我使用CSS Comparer tool from Alan Hart找出两个样式表之间的差异。

这符合我的具体要求。

Answer 2

我尝试使用CSS Compare。它似乎完全符合您的要求。但是，它似乎与多个选择器有一些问题。好的部分是它是命令行驱动的，所以你可以设置一个自动化的过程，如果你有很多CSS文件，或者你可以将CSS文件链接在一起，将它们与一个巨大的结果SASS文件进行比较。此工具将显示所有差异，包括类值的差异。

如果工具显示哪些样式覆盖了同一样式表中的其他样式，那将是多么美妙。许多旧网站以这种方式有很多行李，过滤掉它会很棒。当然，自动化工具可能会导致问题，但至少会产生类似Firebug的报告，除了每个选择器和整个CSS文件集合之外，都会很棒。可悲的是CSS Compare不是一个工具，我不知道一个：（

Answer 3

我会在一个标签中使用一个样式表加载网页，而在另一个标签中使用另一个样式表。然后使用检查器或firebug检查相关节点的样式。

显然，这是非常手动的，但你问的是这样一个破坏过程的绑带，你可能找不到多少帮助。

如果您有一些编程经验，您可以自己编写一个非常简单的解析器来报告每个已定义的类及其样式。但是，这可能是更多的工作，那么它是值得的。

手动执行一次，然后移至SASS（http://sass-lang.com/）并在您的网站周围设置更好的组织来解决问题。