CSS3是前端開發(fā)非常重要的一種技術(shù)，常常會用到其中的動畫效果來美化頁面，今天我們就來學習如何實現(xiàn)一個在5秒之后自動隱藏的圖片。

/* CSS代碼 */
img {
animation: hideImage 5s forwards;
}
@keyframes hideImage {
to {
opacity: 0;
visibility: hidden;
}
}

代碼中，我們使用了CSS3的animation屬性來實現(xiàn)動畫效果，給img元素添加了名為"hideImage"的動畫。動畫的效果就是讓圖片在5秒內(nèi)逐漸變得透明，并且最終隱藏。需要注意的是，我們給動畫的最后一幀添加了forwards關(guān)鍵字，這樣動畫結(jié)束后圖片不會恢復到原來的狀態(tài)。

現(xiàn)在，我們只需要在html中添加一個img元素，并設(shè)置它的src屬性，就可以看到圖片了。

現(xiàn)在打開頁面，待5秒鐘，圖片就會自動隱藏了。