どうも！LSSです！！
以前の記事、の続きです！
クリスマスツリー
追加したコード
@keyframes redblnk{
0%{color:#ff000000;}
100%{color:#ff0000ff;}
}
@keyframes yellowblnk{
0%{color:#ffff0000;}
100%{color:#ffff00ff;}
}
<div style="position: absolute; animation: redblnk 2s linear 0s infinite alternate; top: 150px; right: 80px;">●</div>
<div style="position: absolute; animation: redblnk 2s linear 0.3s infinite alternate; top: 170px; right: 120px;">●</div>
<div style="position: absolute; animation: yellowblnk 2s linear 0.8s infinite alternate; top: 250px; right: 150px;">●</div>
<div style="position: absolute; animation: yellowblnk 2s linear 0.5s infinite alternate; top: 100px; right: 110px;">●</div>
点滅する飾りをつけてみました
単純に、keyframesアニメーション「文字色が透明から赤に変わる」「文字色が透明から黄色に変わる」をそれぞれ用意して、
animation: yellowblnk 2s linear 0.5s infinite alternate;
の開始タイミングをずらす事で、それぞれ点滅しているように見せている感じです。
配置とか種類とか、付け足していかないとですが^^;
ってなとこで、今回はこのへんで！
次回もまた、よろしくお願いします^^
