30天挑戰:「CSS簡易動畫」 相關筆記
總結
使用animation-fill-mode: backwards;讓animation-direction為normal或alternate的元素在動畫開始時的時間點就套用@keyframes 0%時的樣式

筆記
.btn本身設定為position: relative;讓其::after在position: absolute;狀態下可以根據按鈕本體進行定位animation-fill-mode: backwards;讓.btn在動畫開始時就呈現@keyframes moveFromBottom在0%的效果:opacity: 0;與transform: translateY(3rem);.btn:hover::after代表 hover 按鈕後,其::after會放大(scale(1.2, 1.4))並opacity: 0;