检查页面上未使用的CSS类

Question

我正在尝试简化我的页面。目前我有几个CSS文件。我想通过从一个大型CSS文件中获取一些样式来消除一些CSS包含。

确定从特定CSS文件中使用哪些样式的最佳方法是什么？

Answer 1

在Chrome中，您可以审核您的网页，这将显示未使用的规则，包括它们来自哪个文件。只需按F12加载开发人员工具，单击“审核”，然后单击“运行”。

Answer 2

所有现代浏览器都提供了开发人员工具。其中大多数允许您通过右键单击菜单检查元素。在那里，您将看到样式表为这个或那个html元素提供样式（甚至样式表中的行号）。我知道Opera（https://addons.opera.com/en/extensions/details/dust-me-selectors-for-opera/）有一个扩展，它会检查你的CSS是否为空（未使用）选择器，我确信其他浏览器还有其他插件或扩展。

Answer 3

只需按 F12 即可加载开发者工具，然后点击左上角的“元素”。现在单击它下面的任意位置并按 Ctrl + F ，它将打开查找对话框。在其中输入class。它将显示在黄色背景中使用class字在页面中定义类的位置。单击该黄色字会在左侧显示课程详细信息。将所有课程复制到记事本。