概要
CSSのbackground-clipプロパティを使用して、背景画像をテキストの形で切り抜く方法を紹介。用途・要件
- CSSのbackground-clipを使用して、背景画像を文字の形に切り抜く。
- 背景画像を設定したコンテンツの上下左右中央に配置したテキストを切り抜く実装例も記載。(例2)
検証ブラウザ
- Google Chrome(最新)
- Safari(最新)
- Firefox(最新)
- Microsoft Edge(最新)
実装
ローカル環境にコードを移設した際に動作しない場合はこちら。(トラブルシューティングページへ)