今天也好累,新增了圖案縮放的效果:
$item-count: 3
$bg-color: null
@if $item-count == 1
$bg-color: #e74c3c
@else if $item-count == 2
$bg-color: #f1c40f
@else
$bg-color: #2ecc71
@keyframes fadeInOutScale
0%, 100%
opacity: 0
transform: scale(0.8)
50%
opacity: 1
transform: scale(1.2)
.container
display: flex
justify-content: center
align-items: center
height: 100vh
background-color: $bg-color
.item
background-color: #fff
padding: 20px
color: #333
font-size: 1.5rem
border-radius: 8px
margin: 10px
animation: fadeInOutScale 3s infinite
明天再繼續。
加油!