CSS可以用來讓幾張圖片逐漸消失,讓我們來看看如何實現(xiàn)。
.fade { opacity: 1; transition: opacity 1s ease-out; } .fade:hover { opacity: 0; }
以上代碼是一個基本的CSS逐漸消失效果。首先,給圖片一個class名為fade。然后,將透明度設(shè)為1,即不透明。接著,添加一個過渡效果,讓透明度在1秒鐘內(nèi)變化得平滑。最后,當(dāng)鼠標懸停在圖片上時,將透明度設(shè)為0,即完全透明。
如果想讓多張圖片逐漸消失,只需要將它們都添加上該class即可:
以上代碼可以讓三張圖片都具有逐漸消失的效果。