Transitions 過渡

在不同的狀態之間製作平滑的動畫

過渡有助於在元素的不同狀態之間創建一個平滑的動畫。

持續時間和過渡類型可以被訂製，常見的用例是為元素的懸停狀態創建平滑的過渡，以便它們不會在懸停時突然改變。

1. 為按鈕的懸停狀態設置樣式

2. 設置過渡，使懸停時的動畫更加流暢

為按鈕的懸停狀態設置樣式

1. 選擇按鈕

2. 添加盒狀陰影，並對其進行風格化處理。

3. 轉到懸停狀態

4. 增加陰影的強度和距離

5. 切換回無狀態

設置過渡，使懸停時的動畫更加平滑

1. 添加過渡，從屬性下拉選單中選擇盒狀陰影

2. 添加500ms的持續時間

3. 保持緩和狀態不變

4. 將鼠標懸停在按鈕上，可以看到陰影的強度和距離的平滑過渡