text-fill-color プロパティ
text-fill-color property は、
テキスト文字の塗りつぶし色、または値 transparent を使用した透明度を設定します。
構文
セレクタ {
text-fill-color: 色 または transparent;
}
例
テキストに透明度付きのグラデーション塗りつぶしを適用してみましょう:
<p>
This is a text.
</p>
body {
width: 200px;
height: 100px;
}
p {
-webkit-text-fill-color: transparent;
text-fill-color: transparent;
font-size: 26px;
background: linear-gradient(#c42222, #ffef5e);
-webkit-background-clip: text;
background-clip: text;
}
:
関連項目
-
テキストの輪郭線を設定するプロパティ
text-stroke -
テキストの輪郭線の色を設定するプロパティ
text-stroke-color -
テキストの輪郭線の太さを設定するプロパティ
text-stroke-width