如何识别未使用的CSS定义

Question

如何识别未使用的CSS定义是否有任何好的方法来帮助识别项目中未使用的CSS定义？一堆CSS文件被拉进来了，现在我正试图清理一些东西。

Answer 1

Chrome开发工具有一个审计选项卡，它可以显示未使用的CSS选择器。

然后，在网页性能看见删除未使用的CSS规则

Answer 2

我刚找到这个地方-http://unused-css.com/

看起来不错，但我需要彻底检查它输出的‘干净’CSS之前，上传到我的任何网站。

和所有这些工具一样我需要检查它没有去掉没有样式的id和类，而是用作JavaScript选择器。

以下内容摘自http://unused-css.com/因此，值得赞扬的是，他们推荐了其他解决方案：

拉蒂什·塞加尔编写了一个windows应用程序来查找和删除未使用的CSS类。我还没有测试它，但是根据描述，您必须提供html文件和一个CSS文件的路径。然后，该程序将列出未使用的CSS选择器。从屏幕截图看，似乎没有办法导出这个列表或下载一个新的干净的CSS文件。它还看起来该服务仅限于一个CSS文件。如果你有多个你想要清理的文件，你必须一个地清理它们。

尘埃落定选择器是一个Firefox扩展(用于v1.5或更高版本)，它查找未使用的CSS选择器。它从正在查看的页面上的所有样式表中提取所有选择器，然后分析该页面以查看哪些选择器未被使用。然后存储数据，以便在测试后续页面时，可以在遇到选择器时将其从列表中删除。这个工具应该能够蜘蛛整个网站，但不幸的是，我可以使它工作。此外，我不相信您可以配置和下载CSS文件的样式删除。

托普风格是一个Windows应用程序，包括一组用于编辑CSS的工具。我还没有对它进行太多的测试，但看起来它有能力删除未使用的CSS选择器。这个软件花费80美元。

液城CSS清洁器是一个php脚本，它使用正则表达式检查一个页面的样式。它将告诉您哪些类在HTML代码中不可用。我还没测试过这个解决方案。

载重量是CSS覆盖工具。给定一组样式表和一组URL，它确定哪些选择器实际使用，哪些列表可以“安全”删除。这个工具是一个红宝石模块，将只与Rails网站工作。未使用的选择器必须手动从CSS文件中删除。

氦CSS是一个javascript工具，用于在网站上的许多页面中发现未使用的CSS。首先，必须将javascript文件安装到要测试的页面。然后，你必须调用一个氦函数来开始清理。

UnusedCSS.com是一个易于使用的Web应用程序。键入站点的url，您将得到CSS选择器的列表。对于每个选择器，一个数字表示一个选择器使用了多少次。此服务有一些限制。不支持@import语句。您无法配置和下载新的干净CSS文件。

CSSESS是一个书签，可以帮助您在任何网站上找到未使用的CSS选择器。这个工具很容易使用，但是它不会让你配置和下载干净的CSS文件。它将只列出未使用的CSS文件。