偶然發現一個很有意思的載入動畫，效果如下：

乍一看以為是個綠色的gif圖，其實是個白底的gif，而在動的兩個小正方形是透明的，背景色綠色，才會看起來是綠色小gif。

挺奇妙的。

程式碼：

<div style="display: inline-block; background-color: #99cc00;"><img src="https://img2020.cnblogs.com/blog/965593/202110/965593-20211009134116635-848203754.gif" alt="圖片" style="display: block; box-sizing: border-box; width: 22px; height: 16px;"
 
 /></div>

同理，改變父容器的背景色，還可以製造漸變背景色的gif：

<div style="display: inline-block; background-image: linear-gradient(to right, #346ea9 0%, rgba(52, 110, 169, 0.2) 100%);"><img src="https://img2020.cnblogs.com/blog/965593/202110/965593-20211009134116635-848203754.gif" alt="圖片" style="display: block; box-sizing: border-box; width: 22px; height: 16px; visibility: visible !important;"
 
 /></div>

來源是微信的一篇博文：https://mp.weixin.qq.com/s/6D2-hJ3LNytprbdrfUZy7Q

侵刪