PC表示
一見よく見る形のボタン、よくありそうなhoverアニメーション。
よく見ると、背景色と文字色はtransition、ボタンサイズはanimateと二つを掛け合わせリッチな装い。
少しの工夫で各段に印象が良くなるといういい例なので、ぜひすぐにでも取り入れたい。
スマホ表示
SP版はhoverのアニメーションは省かれている。
CSSのメディアクエリに「@media (any-pointer: fine)」や「@media (hover: hover)」を入れることで、スマートフォン実機ではhover機能が働かないように制御することができる。