animate：在CSS中縮放背景

Question

我想爲背景圖片設置動畫效果（從100％縮小到120％） 從100縮放到120可以正常工作。放大到120後，圖像自動設置爲100，並再次開始相同的過程。 我想放大它。 像這樣：從100到120和從120到100.這怎麼可能？

.imageBlub{ 
    background: url('../Images/blub.jpg'); 
    background-size: 100% auto; 
    animation: animatedBackground 6s linear infinite; 

} 

@keyframes animatedBackground { 
    from { background-size: 100% auto; } 
    to { background-size: 120% auto;} 
} 

Answer 1

我建議使用animation-direction: alternate;捐贈：

animation: animatedBackground 6s linear alternate infinite; 

此屬性值，顧名思義，交替動畫導演;首先「前進」（0至100％），然後「後退」（100％至0）。

參考文獻：

• animation-direction。

Answer 2

@keyframes animatedBackground { 
    from { background-size: 0% auto; } 
    to { background-size: 100% auto;} 
} 

試試這個......