タイトル通り、文字を透明にするCSSです。
color: transparent;
以下私が使った例です。
見出しに画像を出力したかったのですが、テンプレートの仕様上、見出しにはテキストしか出力できませんでした。
そこで、力技を使いテキストを画像に変更するため、文字色をcolor: transparent;
で透明にしてbackground-image
で画像で指定し出力させました。
簡単な流れとしては、
STEP
テキストを配置する
STEP
color:transparent; にして文字を消す
STEP
background-imageで背景画像を設置
正直そんなに使いみちはありません。
MDN Web Docs


- CSS: カスケーディングスタイルシート | MDN
は CSS のデータ型で、一つの色を表します。 はアルファチャネルの透過値を含むことがあり、この色を背景とどれだけ混合するかを示すこともできます。