CSS3淡出效果是一種讓頁面元素逐漸消失的動畫效果。通過CSS3中的透明度屬性opacity,可以設置元素的不透明度,從而實現元素的淡出效果。
下面是一個簡單的CSS3淡出效果的例子:
.fade-out { opacity: 0; transition: opacity 1s ease-in-out; }
在上面的代碼中,.fade-out是一個CSS類名,它可以被應用到任何HTML元素上。opacity屬性被設置為0,這意味著元素完全不透明。transition屬性指定了過渡動畫的時長、緩動函數和何時開始過渡。
當該類名應用到某個元素上時,此元素會在1秒鐘內逐漸消失,直到變成完全透明。用戶可以通過設置透明度的過渡時間、緩動函數等來調整該動畫效果的具體表現。