html - Visual Studio Code CSS 错误“不要使用空规则集”

Question

我一直在为 HTML 和 CSS 使用 Visual Studio Code。我收到一个不会影响网站的错误，但我想了解更多信息。当我将鼠标悬停在 HTML 中 ID 的样式上时，会弹出一个框并显示。“不要使用空规则集”。

谁能提供有关“空规则集”的更多信息并解释为什么 Visual Studio Code（或任何其他编辑器）会警告空规则集？

Answer 1

在 CSS 中，规则集是构成样式表的基本构建块之一：

.example {
    font-size: 1.25rem;
    color: red;
}

空规则集是没有任何属性声明的规则集，只是一个选择器：

#id {
}

正如您所注意到的，这些规则对文档的呈现没有任何影响，但一些浏览器会在评估 CSS 时使用它们，但在那里什么也找不到。性能迷讨厌这种不必要的开销，所以为了清洁起见，最好擦洗它们。事实上，CSS Lint 有一条专门针对空规则集的规则，而 Code 只是使用相同的规则集动态地对 CSS 进行 lint。

但是，空规则集可以用于解决某些浏览器错误，例如这个。在这种情况下，删除空规则集实际上会对页面呈现产生不利影响，因此应该将它们保留在那里，理想情况下带有记录其用途的注释。

css.validate您可以通过在 settings.json 文件中设置为 false来禁用 linting 。请参阅文档以了解如何执行此操作。