大家好，本篇文章分享經典Loading加載縮放動畫特效，歡迎參考和指正。

效果圖：

Loading加載縮放動畫特效

HTML代碼：

CSS代碼：

知識點：

animation：是CSS3的動畫屬性，這里把animation綁定到tui-demo-5元素上，并指定該動畫需要0.4秒完成，infinite則表示無限次播放該動畫，alternate則表示動畫會在奇數次數正常播放，而在偶數次數向后播放，animation-delay則表示動畫在啟動前的延遲間隔。

@keyframes：該規則表示動畫可以逐步從一個CSS樣式改變為另一個CSS樣式。這里0％是動畫開頭，100％是動畫結束。

transform：該屬性應用于2D元素或3D元素的轉換，允許元素發生旋轉，縮放，移動，傾斜等效果。scale定義2D縮放，可以配置縮放大小。opacity定義元素的不透明級別。

最后注意下瀏覽器兼容問題，-webkit-,-ms-或-moz-，有問題可以留言，大家一起學習HTML+CSS基礎入門開發。

總結

以上是生活随笔為你收集整理的html间隔代码_HTML+CSS基础入门开发，经典Loading加载缩放动画特效的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。