Visual Studio Code CSS-Fehler "Verwenden Sie keine leeren Regelsätze"

Question

Ich habe Visual Studio Code für HTML und CSS verwendet. Ich bekomme einen Fehler, der die Website nicht beeinträchtigt, aber ich würde gerne mehr darüber erfahren. Wenn ich den Mauszeiger über das Styling für eine ID in HTML bewege, erscheint eine Box und sagt: "Verwenden Sie keine leeren Regelsätze".

Kann jemand mehr Informationen zu "leeren Regelsätzen" bereitstellen und erklären, warum Visual Studio Code (oder ein anderer Editor) vor einem leeren Regelsatz warnt?

Answer 1

In CSS, ein ruleset ist einer der Grundbausteine, die ein Stylesheet bilden:

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

Eine leere ruleset ist eine, die keine Eigenschaftsdeklarationen hat, nur ein Selektor:

#id { 
} 

Wie Sie bemerken, haben diese Regeln keine Auswirkungen auf das Rendern eines Dokuments, aber some browsers will consume them bei der Bewertung von CSS, nur um dort nichts zu finden. Performance Junkies verabscheuen alle unnötigen Overhead dieser Art, so ist es besser, sie für Sauberkeit zu schrubben. In der Tat hat CSS Lint eine Regel speziell gegen leere Regelsätze, und Code ist einfach flossen Ihr CSS mit der gleichen Reihe von Regeln.

Leere Regelsätze können jedoch nützlich sein, um bestimmte Browserfehler wie this one zu umgehen. In solchen Situationen hat das Entfernen des leeren Regelsatzes nachteilige Auswirkungen auf das Seitenrendering. Daher sollten sie dort belassen werden, idealerweise mit einem Kommentar, der ihren Zweck dokumentiert.

Sie können das Löschen deaktivieren, indem Sie css.validate in der Datei settings.json auf false setzen. Sehen Sie die documentation für wie dies zu tun ist.