Wie kann ich Zeilenkommentare anstelle von Blockkommentaren zu mehrzeiligem HTML- oder CSS-Code in VS Code hinzufügen? ⇐ CSS

[Anonymous]

Wenn Sie in VS Code Strg + / zum Auskommentieren von Code in bestimmten Sprachen wie Python oder JavaScript verwenden, wird standardmäßig ein Zeilenkommentar zu jeder Zeile hinzugefügt, anstatt einen Blockkommentar zu erstellen.
Zum Beispiel in JavaScript:

Code: Select all

// let i = 1
// function abc() {
//   let i = 0;
//   console.log(i);
// }

VS Code erstellt nur dann einen Blockkommentar, wenn Sie Umschalt + Alt + A verwenden,

Code: Select all

/* function abc() {
let i = 0;
console.log(i);
}
*/

Bei HTML oder CSS sind die Dinge jedoch anders – egal, ob Sie Strg + / oder Umschalt + Alt + A verwenden, VS Code fügt immer einen Blockkommentar hinzu, etwa so:

Code: Select all

.banner {
/* display: block;
margin: 0 auto;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.5); */
}

Dies ist insbesondere in CSS nicht sehr praktisch, da wir häufig Eigenschaften kommentieren und auskommentieren müssen, um schnell verschiedene Stile im Browser zu testen.
Wenn ich beispielsweise die Auswirkung des Hinzufügens der Eigenschaft „background-color“ sehen möchte, muss ich zuerst den Blockkommentar entfernen und dann die Eigenschaften „display“, „margin“ und „border-radius“ erneut auskommentieren:
Wenn VS Code verwendet wird Wenn ich stattdessen Zeilenkommentare verwenden möchte, könnte ich die Zeile einfach mit „background-color:
“ auskommentieren

Code: Select all

.banner {
/* display: block; */
/* margin: 0 auto; */
/* border-radius: 50%; */
background-color: rgba(255, 255, 255, 0.5);
}

Ich weiß nicht, warum VS Code sein Kommentarverhalten für HTML und CSS ändert, aber es ist wirklich unpraktisch.
Gibt es also eine Möglichkeit, dies zu ändern?
Ich habe diese Lösung online gefunden: Verwenden Sie einzeilige Kommentare für HTML und CSS.
Allerdings ist es nicht perfekt.
Nehmen wir zum Beispiel JavaScript nochmal:

Code: Select all

let i = 1;
function abc() {
// let i = 0;
console.log(i);
}

Hier ist eine Zeile bereits auskommentiert.
Wenn ich jetzt den gesamten Block mit Strg + / auskommentiere, erhalte ich:

Code: Select all

// let i = 1
// function abc() {
//   // let i = 0;
//   console.log(i);
// }

Wie Sie sehen können, wird die Zeile let i = 0; doppelt kommentiert, was genau das ist, was ich möchte.
Aber mit der im Link oben bereitgestellten Methode, wenn Sie bereits Code in CSS wie diesen kommentiert haben:

Code: Select all

.banner {
display: block;
/* margin: 0 auto;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.5); */
}

und dann Strg + / drücken, werden stattdessen tatsächlich die bereits kommentierten Zeilen auskommentiert:

Code: Select all

.banner {
/* display: block; */
margin: 0 auto;
/* border-radius: 50%; */
/* background-color: rgba(255, 255, 255, 0.5); */
}