Visual Studio Code CSS 错误“不要使用空规则集”[关闭]

Question

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

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

Answer 1

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

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

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

#id {
}

正如您所注意到的，这些规则对文档的呈现没有任何影响，但是some browsers will consume them 在评估 CSS 时却发现什么都没有。性能迷讨厌任何此类不必要的开销，因此为了清洁起见，最好擦洗它们。事实上，CSS Lint 有一条专门针对空规则集的规则，而 Code 只是使用相同的规则集动态地对 CSS 进行 lint。

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

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