任意のテキストで画像をクリップしてくり抜く -『CSS』
background-clip: textのプロパティを使うことで画像をテキストでくり抜くことができます。Photoshopでクリッピングマスクかける感じですね。
background-clip: text
CSS
.clip {
background-size: cover;
-webkit-background-clip: text;
background-clip: text;
background-image: url("https://c1.staticflickr.com/1/361/19427534675_ffc194fddf_o.jpg");
color: transparent;
font-size: 8em;
line-height: 1.05;
font-weight: bold;
text-align: center;
}
おわります。
