Es ist nützlich, wenn DevTools Ihnen mitteilt, dass eine Deklaration ungültig ist. Zum Beispiel ist colr: red; nicht gültig, da colr keine gültige Eigenschaft ist. Ebenso ist color: rd; nicht gültig, da rd kein gültiger Wert ist. Größtenteils zeigt die DevTools eines Browsers die Deklaration als durchgestrichen mit einem Warnsymbol (
) an. Es wäre schön, wenn sie einen Schritt weiter gehen würden, um Ihnen mitzuteilen, was falsch war (oder beides) und wahrscheinliche Korrekturen vorschlagen, aber hey, ich will ein geschenktes Pferd nicht ins Maul schauen.
Firefox beginnt, einen Schritt weiter zu gehen und Ihnen mitzuteilen, wann bestimmte Deklarationen nicht gültig sind, nicht wegen eines Syntaxfehlers, sondern weil sie andere Qualifikationen nicht erfüllen. Zum Beispiel habe ich grid-column-gap: 1rem auf ein beliebiges <p> angewendet und mir wurde dies in einem kleinen Popup mitgeteilt:
grid-column-gaphat keine Auswirkung auf dieses Element, da es kein Flex-Container, kein Grid-Container oder kein Mehrspalten-Container ist.Versuchen Sie, entweder
display:grid,display:flexodercolumns:2hinzuzufügen. Mehr erfahren
Das ist wirklich praktisch.
Elijah Manor hat einen Blogbeitrag und ein Video, die sich damit näher befassen.