有没有工具可以告诉我是否有未使用的CSS类？

Question

想象一下，我有一个<p>类的title元素：

<p class='title'>Title</p>

和

.title {
    font-size: 14px;
}

然后出于任何原因，我决定删除<p class='title'>Title</p>，但忘记删除CSS规则。

是否有一个工具可以显示项目文件中未使用的所有CSS规则，以清理我的代码？

我正在使用Atom作为文本编辑器。也许插件可以做到这一点？

Answer 1

Chrome Devtools具有a coverage tab，可以找到未使用的CSS和JS。

  

每行代码都用颜色编码：

     

  

• 纯绿色表示已执行该行代码。

  

• 红色常亮表示未执行。

  

• 红色和绿色的代码行（例如图2中的第3行）意味着仅执行该行上的某些代码。对于   例如，像var b =（a> 0）的三元表达式？ a：0是   都涂成红色和绿色。