画像をCSSだけで文字テキストの背景としてくり抜く！

背景が写真などの文字テキストを作りたい場合、わざわざ画像を新たに作成していませんか？

今回はcssだけで画像を文字テキストの背景としてくり抜くcssをご紹介します！

それは、対象の要素に下記記述を指定するだけ！

/* background-image:url(対象の画像パス); を指定すること！ */

background-clip: text;
-webkit-background-clip: text;
color: transparent;

「background-clip」って何？

background-clipプロパティでは、要素の背景を境界ボックス、パディングボックス、コンテンツボックスに分けて、その中でどの範囲まで背景を拡張するか？を指定できます。

指定奉納によってさまざまな表現方法が実現できるのでぜひチャレンジしてみてくださいね！

正しい効果測定は、正しい計測設定から！Googleアナリティクス設定項目チェックシート（無料）

Googleアナリティクスは、適切な初期設定を行って初めて、解析に役立つデータを計測できます。 正しい効果測定を行う上で、必要な設定項目のチェックシートをご用意しました。