CSS可以為網(wǎng)站添加很多有趣的功能,其中之一就是可以用CSS制作動態(tài)壁紙,讓你的網(wǎng)站更加生動有趣。以下是一些示例代碼和說明:
// 首先,我們需要一個父容器 .container { position: fixed; top: 0; left: 0; bottom: 0; right: 0; overflow: hidden; } // 然后,添加一個子容器用來顯示壁紙 .wallpaper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; animation: wallpaperAnimation 60s infinite; } // 定義一個動畫來改變壁紙背景 @keyframes wallpaperAnimation { 0% { background-image: url("image1.jpg"); } 25% { background-image: url("image2.jpg"); } 50% { background-image: url("image3.jpg"); } 75% { background-image: url("image4.jpg"); } 100% { background-image: url("image5.jpg"); } } // 最后,在HTML中添加父容器和子容器
這段代碼將會循環(huán)播放五張不同的圖片作為壁紙背景。你可以根據(jù)自己的需求改變動畫時間和替換圖片來實現(xiàn)不同的效果。