新着! 私の44ページの電子書籍「44分でわかるCSS」が発売されました! 😃

今すぐ入手 →

#text-shadow

テキストコンテンツの影を定義します。

default text-shadow: none;

テキストコンテンツに影はありません

text-shadow: 2px 6px;

少なくとも2つの値が必要です

  • 1つ目は水平方向のオフセット
  • 2つ目は垂直方向のオフセット

影の色は、テキストの色から継承されます。

text-shadow: 2px 6px red;

最後の値としてを定義できます。

colorと同様に、色名、16進数、rgb、hslなどを使用できます。

text-shadow: 2px 4px 10px red;

オプションの3番目の値は、影のぼかしを定義します。

この例では、色が不透明から透明まで10pxにわたって拡散します。