テキスト背景に画像を入れる
photo1.cssを参考
imgフォルダー「colorful.jpg」で作ってみよう
- class名／tit2
- テキストCOLORFUL
- font-size／6em （スマホでは3em）
GREEN☻
HTML
<p class="tit">GREEN</p>
CSS
.tit {
background: green url("../img/green1.jpg");
background-clip: text;
-webkit-background-clip: text;
color: transparent;
margin:20px 0;
font-size:120px;
text-align: center;
font-weight: bolder;
}
/* スマホ用css */
@media(max-width:600px){
.tit{
font-size:45px;
}
}
自由作成
今度は自分で写真をダウンロード。
CSSも作成してみよう！！