CSS3 提供了許多好用的動畫效果，其中包括隱藏收起動畫。使用這種動畫可以增強頁面交互性和美觀性。

/* 使用 transition 實現隱藏收起動畫 */ 
.content { 
max-height: 0; 
overflow: hidden; 
transition: all 0.5s ease-in-out; 
} 
.content.show { 
max-height: 500px; 
}
/* JS 控制 class 的添加和刪除 */ 
document.querySelector('.toggle-button').addEventListener('click', function() { 
var content = document.querySelector('.content'); 
content.classList.toggle('show'); 
});

以上代碼的思路是：先通過設置 max-height: 0 和 overflow: hidden 讓內容隱藏，然后通過添加 .content.show 類名使其展示出來。transition: all 0.5s ease-in-out 添加了動畫效果，從而實現了隱藏收起動畫。

至于如何觸發這個動畫，可以使用 JS 控制 class 的添加和刪除。例如，以上代碼中添加了一個 .toggle-button 元素，當點擊該元素時，會觸發控制動畫的 JS 代碼。當用戶點擊該按鈕時，會自動添加或移除 .content.show 類名，從而產生動畫效果。