transition-propertyの値が詳細に指定できない

Question

前提・実現したいこと

transitionに特定のプロパティを指定したいんですが、allとnone以外は白くなってしまいます(backgroundは赤文字)。私が使っている配色テーマは、プロパティの値に問題がなければ文字列はオレンジ色になります。動作確認をしましたがやはり適応されていませんでした。何が問題なんでしょうか。

別のサイトをコーディングしているときも同じ現象が起きていたので今のコードに原因があるとは思えません。

該当のソースコード

<p class="button"><a href="#">Read More</a></p>

試したこと

transition-propertyと打ってから指定しても同じ結果でした。

補足情報（FW/ツールのバージョンなど）

dynabook V72/JLE
型番:PV82JLECNRDQE

ちなみに配色テーマはVSCodeのDark+(既定のDark)というものです。（transition-propertyの検証のために不要なプロパティを指定している箇所があります。）

Comments

[maisumakun]

「適応されていませんでした」というのは色だけの問題ですか？ブラウザでも適用されていない状況でしょうか？

Answer 1

transition-propertyに指定できる値は<custom-ident>となっていて、文法的にはCSSプロパティ名に限られません（MDN）。

キーワードとなっているallやnoneは別ですが、それ以外の値はCSSとして特別な値ではないので、色がつかない、というだけではないかと考えます。

Comments

[maisumakun]

同様に<custom-ident>を取るanimation-name（こちらはCSS作者が任意に名付ける）も、値に色が入らないようです。