CSS"Normalizer"工具？

Question

我需要维护和改进现有的网站,我在我的CSS样式表中发现的冗余中淹没了.鉴于元素的现有冗余和非方法逻辑排序,很难跟踪和预测微小变化如何在系统中传播,或者在何处应用变化以实现某种效果,而无需花费大量时间重新学习CSS文件和实验.

我一直在使用Firefox的最新Firebug和"Web Developer"附加组件,但显然它们对我来说还不够.我需要一个可以告诉我冗余"覆盖"的工具,并且可能建议一个更好的级联方案.

换句话说,帮助我生成最短的CSS文件,它提供了我现在拥有的完全相同的视觉功能.

为了进一步澄清,我不是在寻找一种工具,用"#000"代替"#000000",用".5em"替换"0.5em",用"#FFF"代替"白色"等(这个地址为"字符"冗余,但不解决"级联逻辑"冗余).我正在寻找一个工具,可以告诉我,例如,子元素的"font-size:10px"属性是多余的,因为它已经从其父元素继承.

更高级的功能:类或id的"color:#000000"属性是多余的,因为它不在网站上的任何HTML/PHP文件中使用.

是否有自动执行此类"规范化"的工具？

Answer 1

要根据标记查找重复/未使用/不必要的 CSS，您可以尝试WARI或Dust-Me 选择器（如@Aaron D提到的）或CSS Crunch。最后两个是浏览器扩展（分别适用于 Firefox 和 IE），它们只会查看一页，而 WARI 旨在查看整个站点。然而，我并没有很幸运地让 WARI 发挥作用。