使用方式

1. 看名稱樣式效果圖，有沒有和自己想要的效果類似的
2. 有的話，複製粘貼代碼使用，也可以自己修改一下
3. css效果並不是特別難，只是有時候我們可能想不到
4. 筆者空閒時間，會繼續更新的哦，點贊關注不迷路**^_^**

代碼github倉庫：https://github.com/shuirongshuifu/interestingCSS

1\_鼠標懸浮文字陰影跳動

2\_鼠標懸浮文字底部出現下劃線並變寬

3\_文字顏色漸變流光效果

4\_打字機效果

5\_文字左右旋轉晃動效果

6\_圓圈呼吸擴散效果

7\_音頻波紋加載效果

8\_四周線條環繞流動效果

9\_鼠標懸浮開門關門效果

10\_吃豆人效果

11\_背景顏色流動效果

12\_小球轉圈加載效果

13\_鐘擺效果

14\_文字煙霧消散效果

15\_水平左右抖動效果

16\_垂直方向墜落彈跳效果

17\_仿figma加載中盒子轉圈效果

18\_文字橫向伸展模糊淡入淡出效果

19\_四個方向盒子旋轉移動進入效果

20\_按鈕點擊波紋效果

21\_鼠標懸浮按鈕邊框線條動畫效果

22\_燈泡開關效果

23\_鼠標懸浮手風琴樣式展開圖標效果圖

24\_文字按順序彈跳效果

25\_漸變進度條

26\_文字模糊依次出現

27\_鼠標懸浮探照燈效果

28\_文字光標來回刷效果

29\_輸入框校驗不通過左右抖動效果

30\_文本逐字展示效果

31\_圖片跟隨鼠標移動效果

32\_鼠標移動探照燈、點擊放大鏡效果

33\_emoji仿省略號...動畫效果

34\_小飛機跟隨鼠標移動

35\_滑塊控制動畫執行（css精細方式）

36\_邊框漸變鼠標懸浮移動效果

37\_骨架屏流光滑動陰影效果（附陰影大全可選）

38\_帶角傾斜風格按鈕

39\_盒子邊界碰撞回彈效果

40\_手機充電動畫效果

41\_文字陰影漸變效果

42\_小人眼睛隨着鼠標移動效果

43\_筆記本樣式效果

44\_兩種方式的馬賽克背景圖

45\_party-js粒子動畫

46\_文字抖動陰影

47\_卡片翻頁倒計時效果

48\_卡片翻轉效果

49\_文字滾動鏤空轉實體效果

50\_文字從下方依次彈跳出現效果

51\_title-tootip