我需要更普适的解决方案，但最近的一个例子是我的两个菜单。我有两个菜单类别horizontal-menu和vertical-menu，以及两组规则用于这些类别下的元素，例如ul、li和a。许多这些规则有共同点，例如a元素的color值。我想将共同规则和值重构为一个名为menu的"超级类"，并仅在horizontal-menu和vertical-menu类中覆盖值。是否有工具（除了提问本问题的工具）可以帮助我完成这项工作？
CSS重构的工具和技术
7
- ProfK
2个回答
1
这种问题的最佳工具是Compass，它是一种定义规则并将其编译成用于生产的 CSS 的框架。它允许您以类似命令式语言的方式定义变量。
它还有其他有用的概念，例如mixins，允许定义一组经常一起使用的 CSS 属性，以便在多个标准 CSS 规则中包含该属性块。其强大之处在于您可以在一个地方编辑该 mixin，更改属性并使该更改传播到使用 mixin 的任何 CSS 规则中。
我发现了Compass，并学会了如何使用它，这要感谢a screencast ，由Chris Coyier 在 CSS Tricks 上制作。
唯一的问题在于，在这种情况下（实际上大多数情况下），你真的必须从 Compass 开始，或者找到一种将其工作流整合到现有工作流中的方法。
它还有其他有用的概念，例如mixins，允许定义一组经常一起使用的 CSS 属性，以便在多个标准 CSS 规则中包含该属性块。其强大之处在于您可以在一个地方编辑该 mixin，更改属性并使该更改传播到使用 mixin 的任何 CSS 规则中。
我发现了Compass，并学会了如何使用它，这要感谢a screencast ，由Chris Coyier 在 CSS Tricks 上制作。
唯一的问题在于，在这种情况下（实际上大多数情况下），你真的必须从 Compass 开始，或者找到一种将其工作流整合到现有工作流中的方法。
- Marcus Whybrow
1
Compass框架使用的CSS预处理器称为Sass（http://sass-lang.com/）。 - David Rivers
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接