箱をクリックしていくと一つだけ当たりが出るおみくじのようなゲームを作ってみます。
- 仕上げ
仕上げ
・前回まででランダムで一つだけ大吉と表示されるようにしそれ以外は小吉と表示されるようになるおみくじを作ってきました。
・今回はそのおみくじにCSSでスタイリングを書き加えていきます。
・まずclass属性で.greatと.goodの２つが必要になってくるのでその２つを作っていきます。
・.greatは今まで作ってきた.circleをそのまま使っていけば回転しながら丸くなってくれるのでそのまま使い背景を少し豪華にするためにgoldにして、文字を太くするくらいの変更を加えて行きます。
・.goodの方はクリックしたら少し小さくなるアニメーションと背景を赤くするアニメーションだけ追加知っていきます。小さくしたい場合はtransform: scale(.9);で90%の大きさにすることができます。