1. ホーム
  2. html

[解決済み] Visual Studio Code CSSエラー「空のルールセットを使用しないでください」【終了しました

2022-02-08 14:32:42

質問

HTMLとCSSはVisual Studio Codeを使用しています。ウェブサイトに支障をきたさない程度のエラーが出るのですが、詳しく教えてください。HTMLのIDのスタイリングにカーソルを合わせると、ボックスがポップアップしてこう表示されます。 "空のルールセットを使用しないでください"。

また、なぜVisual Studio Code(または他のエディタ)が空のルールセットについて警告を出すのか、説明できる方はいらっしゃいますか?

解決方法を教えてください。

CSSでは ルールセット は、スタイルシートを構成する基本的な構成要素の一つである。

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

空のルールセットとは、プロパティの宣言を持たず、セレクタだけを持つルールセットです。

#id {
}

お気づきのように、これらのルールはドキュメントのレンダリングには何の影響も及ぼさないのですが 一部のブラウザは、それらを消費します。 CSSを評価しても、何も出てきません。パフォーマンスジャンキー 忌み嫌う このような不要なオーバーヘッドは、クリーンな状態にするために削除したほうがよい。実際、CSS Lintには空のルールセットに対する特別なルールがあり、Codeは同じルールセットでCSSをオンザフライでLintしています。

しかし、空のルールセットは、次のような特定のブラウザのバグを回避するのに便利です。 これ . このような状況では、空のルールセットを削除すると、実際にはページレンダリングに悪影響を及ぼすので、そのままにしておくべきです。理想的には、その目的を文書化したコメントを付けると良いでしょう。

を設定することで、リンティングを無効にすることができます。 css.validate を false に設定します。を参照してください。 ドキュメント を実行する必要があります。