CSS 是前端開發中不可或缺的一部分，它可以用來美化頁面的樣式。在 CSS 中，我們可以使用過渡（transition）效果來讓頁面的變化更加靈活絲滑。在本文中，我們將介紹如何實現通過 CSS 在 5 秒后自動變換背景色的效果。

/* 設置初始狀態的背景色 */
body {
background-color: #fff;
}
/* 設置過渡效果 */
body {
transition: background-color 5s ease;
}
/* 觸發變化 */
body.changeBackground {
background-color: #000;
}

代碼解析：

• 首先，我們需要為頁面設置一個初始的背景色，這里我們選擇了白色作為背景色。
• 接著，我們通過 CSS 中的 transition 屬性來設置過渡效果，它會在 5 秒的時間內平滑地將背景顏色從初始狀態變為目標狀態。
• 最后，我們通過 JavaScript 來觸發背景色的變化，可以看到，我們給 body 添加了一個名為 changeBackground 的類名，當該類名被添加時，背景色就會自動變成黑色。

這就是如何通過 CSS 來實現 5 秒后自動變換背景色的效果。歡迎大家在實際開發中嘗試使用此技巧，為頁面帶來更加生動有趣的變化。